어제 작성했던 [JQuery] 위로 롤링되는 코드 를 약간 수정한 것이다. 스크립트 코드를 jQuery Plugin 형식으로 변경한 것이다. $.fn 으로 시작되는 코드를 봤을 때 ‘저건 뭔가?’ 이렇게 생각을 했는데 막상 사용해보니까 상당히 직관적이고 편한 방법이라는 생각이 들기 시작했다. 앞으로는 이런 식으로 작업을 해야겠다는 생각도 들었는데.. 어찌보면 class와 비슷한 개념이라 생소했는데 사용해보니까 모른척 넘어가야할 대상은 아닌 것 같다는 생각이 …
위 이미지와 같이 위에서 순차적으로 내려오는 이미지를 구현하기 위한 코드이다. 개발 중인 쇼핑몰 솔루션에 적용예정인데 이런 기능을 하는 jQuery 플러그인 등이 있지만 간단하게 jQuery의 each(), animate(), delay() 를 사용하면 구현할 수 있다. 약간의 css 까지 더해지면 더할나위 없을지도 모른다. 아래는 간단한 문서구조이다. <ul> <li class=”first”> <div>이미지</div> <div>이미지</div> <div>이미지</div> </li> <li> <div>이미지</div> <div>이미지</div> <div>이미지</div> </li> </ul> …
요즘들어 체력이 많이 부족하다는 걸 절실히 느끼고 있다. 간만에 좀 신나는 jQuery 애니메이션 작업을 좀 했다고 이렇게 피곤해서야.. ㅋ 간만에 작업해서 재미있었는데 감각이 많이 떨어진 것 같았다. 코드는 간결해졌지만 뭔가 아쉬움이 남는 듯한.. 원하는대로 잘 안되는.. 어떻게 해야할지 생각이 잘 나지 않아서 조금 고생했다. 그래도 잘 마치고 왔다고 생각했는데.. 뭔가 문제가 있어 내일 출근해서 수정을 …
오랜만에 만들어본 jQuery 롤링 코드이다. 아래와 같은 문서구조에서 li 가 위로 롤링되는 것이다. <ul> <li> <div>이미지</div> <div>이미지</div> <div>이미지</div> </li> <li> <div>이미지</div> <div>이미지</div> <div>이미지</div> </li> </ul> 그리고 아래는 css 코드이다. 설명을 위해 간단하게 작성했기 때문에 실제 적용은 안될 수 있다. ul { position: relative; width: 700px; height: 300px; overflow-y: hidden; } li { position: absolute; top: …
아침에 워드프레스 3.6으로 무작정 업데이트 했다가 블로그의 라이트박스 등의 플러그인이 제대로 동작하지 않아 급하게 3.5.2버전으로 롤백했다가 다시 3.6으로 업데이트했다. 워드프레스의 문제는 아니었는데 잘 알아보지도 않고.. 명색이 개발쪽 일을 하고 있는데.. ㅋ jQuery 버전이 낮아서 문제가 발생했던 것인데 이걸 테마에서 높은 버전으로 수정해주니 이상없이 작동되길래 다시 업데이트했다. 업데이트 글쓰기 할 때 Autosave 관련해서 메세지가 나오는데 이건 …