Blog://history : Drama post design #6

Study/Etc_Studying

Blog://history : Drama post design #6

AneOK 2020. 12. 1. 13:15

Blog HISTORY : Drama post design 블로그 히스토리

이 블로그에 사용중인 드라마 부분의 포스트 변경한 모습을 담았습니다.

드라마 포스트 변경 기록 Drama

처음 한 모양이 마음에 들었지만, 너무 페이지가 길어져서 변경하게 되었습니다. 그 후 6번을 변경하여 지금의 모습으로 변하였지만, 변경하면 할수록 손은 더 많이 가는군요. 그래도 손이 더 가지만 점점 더 나아지는 보습이 보이니 그것으로 만족은 하고 있습니다.

jQuery을 사용 - #6

장점

포스트만 보여서 가로, 세로 사이즈 조정리 쉽게 하였습니다.

jQuery의 배열 데이터를 이용 예전에는 CSS로만 했던 것이 데이터 추가로 쉽게 추가할 수 있습니다.

var movie = [
// '제목','부제목','이미지주소','개봉','시간','등급','장르','나라', 평점, 'URL', 종류(0:영화, 1:드라마), 추천 , 시청률
// ----------------------
['이태원 클라쓰', // '제목'
'Itaewon Class', // '부제목'
'https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=http%3A%2F%2Fcfile5.uf.tistory.com%2Fimage%2F9932A0415FA3A54B0B113E',
'2020', // 년도 (영화시 '개봉날자 2019.03.20')
'JTBC 16부작', // '편성' (영화시 '개봉')
'15세이상관람가',
'드라마,로맨스',
'한국', // '국가'
7.95, // (점수) 퍼센트
'http://tv.jtbc.joins.com/itaewonclass', // 맥스무비, 네이버 영화 & 공식 URL
1, // 종류 (0:영화, 1:드라마)
0, // 추천 (0, 1:추천)
16.5], // (시간)number - 시청률 (영화시 시간)
];

마우스 드래그 시 상세 부분이 나오는 방식이라 한눈에 들어오는 부분입니다.
범용으로 사용 가능 (현재 영화, 드라마 사용함)

단점

모바일 부분에서 포스트 이미지가 따로 보이는 부분이라 포스트 사이즈 변경을 한 후 이미지 업데이트해야 합니다.
드라마 내용 부분에서 줄거리를 넣지 못하는 것이 흠.
포스트 사이즈 넘게 글을 쓸 수 없는 것이 아쉬움.

Sieve jQuery Plugin을 사용 - #5

장점

단어를 검색할수 있게 하고 그검색의 부분만 보여지게 하는 jQuery를 사용하였습니다.
Sieve jQuery Plugin v0.3.0
한 화면에 3개를 넣었더니 작게 보여져서 2개를 넣었어 좀더 쉽게 볼수 있게 하였습니다.
다이나믹 그리드를 설치해서 해 보았지만 top,left CSS문으로 되니 검색 부분과 더보기 부분이 있으면 이상하게 보여저서 이것으로 했습니다.