'jQuery'에 해당되는 글 2건

  1. 2010.05.28 JQUERY MARQUEE(마퀴) 효과
  2. 2010.05.03 JQUERY 이미지 롤오버

JQUERY MARQUEE(마퀴) 효과

웹프로그램관련/JQUERY 2010. 5. 28. 08:54

MARQUEE테그가 익스플로러에서 제한적이고 끊기는 맛이 있어서
좀더 스므스 하게 사용될수 있는 JQUERY 플러그인 입니다.

데모페이지 : http://remysharp.com/demo/marquee.html
다운로드: http://remysharp.com/2008/09/10/the-silky-smooth-marquee/

파이어폭스에서도 동일하게 작동합니다.

이동속도 조절은 jquery.marquee.js에 91번라인 수정으로 간단하게 변경가능하군요..

[참고]
http://www.givainc.com/labs/marquee_jquery_plugin.htm


저작자표시 비영리

'웹프로그램관련 > JQUERY' 카테고리의 다른 글

JQUERY 이미지 롤오버  (0) 2010.05.03
Posted by 후덜덜~
,

JQUERY 이미지 롤오버

웹프로그램관련/JQUERY 2010. 5. 3. 15:07
<html>
<head>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script>
$(document).ready(function(){
   $('.rollover').hover(function() {
   var currentImg = $(this).attr('src');
   $(this).attr('src', $(this).attr('hover'));
   $(this).attr('hover', currentImg);
   }, function() {
   var currentImg = $(this).attr('src');
   $(this).attr('src', $(this).attr('hover'));
   $(this).attr('hover', currentImg);
   });
});
</script>
</head>
<body>
<a href="#"><img src="off.gif" hover="on.gif" width="10" height="10" class="rollover"></a>
</body>
</html>

대략 위에
img 테그에 src와 hover 에 이미지 정보 삽입후 class 에 rollover 삽입 하면 간단하게 이미지 롤오버가 완성됩니다.

이미지 유지의 경우 class를 공백으로 처리하면 되겠네요
저작자표시 비영리

'웹프로그램관련 > JQUERY' 카테고리의 다른 글

JQUERY MARQUEE(마퀴) 효과  (0) 2010.05.28
Posted by 후덜덜~
,

티스토리툴바