각종 IT 정보/블로그 Tip/Tech

반응형스킨 내비게이션 메뉴 정리하기

이바구™ - 2014. 5. 9. 11:35

티스토리 반응형 스킨인 Spidersweb 이 어느 정도 자리를 잡아 가는 것 같습니다. 그 동안 이것 저것 바꾸느라 조금 어수선했는데 끝까지 참아주신 방문자님들께 감사의 말씀을 드립니다.

 

없는 시간을 쪼개 뭔가 바꾸긴 바꿔야 하겠는데 상단의 실시간 방문자 숫자를 보면 차마 클릭을 할 수 없겠더군요. 그렇다고 방문자가 적은 새벽시간을 이용할 수도 없고 - 요새는 새벽에도 방문자가 많더군요 - 뒷통수가 근질 근질함을 참으면서 과감히 클릭질을 해댔습니다. 그 여파로 가끔 튕겨져 나간 분들도 있을텐데 이 자리를 빌어 그 분들께 심심한 사과의 말씀을 드립니다.

 

 오늘은 같은  Spidersweb 티스토리 반응형스킨을 사용하는 분들에게 도움이 되는 정보입니다. 아래 그림처럼 상단 내비게이션바의 특정 메뉴를 우측으로 이동하는 팁입니다.

 

 

먼저 내비게이션에서 오른쪽으로 보낼 리스트를 < UL>... < /UL>태그로 묶어 줍니다.

 

 

 

그리고 클래스로 지정한 아래 코드를 html/CSS 문서에 삽입합니다.

 

 

그리고 마지막으로 미디어쿼리 767px 이하 모바일에서는 보이지 않게 nav-right의 값을 없애 줍니다.

 

 

그럼 지금과 같이 중간에 있던 실시간 방문자 카운터가 우측으로 이동한 것을 볼 수 있을 것입니다.

 

 

아래 텍스트 문서로 저장해 두었으니 필요하신 분 다운 받아 적용해 보세요.

 

새 텍스트 문서 (2).txt

※ 이 코드는 마크쿼리님께서 제공해 주셨습니다. 

 

참고 Link

.