jquery 모바일 이미지 슬라이드

검색어 : jquery 모바일 이미지 슬라이드

http://sir.co.kr/bbs/board.php?bo_table=g4_tiptech&wr_id=32377

jquery.blueberry.수정.zip

모바일웹에 괜찮은 이미지 슬라이더입니다. 

아래와 같이 수정했습니다. 
ul, li => div로 수정 
.css, .js 파일도 수정 


<div class="blueberry"> 
  <div class="slides"> 
    <div><img src="http://marktyrrell.com/labs/blueberry/img/slide1.jpg" /></div> 
    <div><img src="http://marktyrrell.com/labs/blueberry/img/slide2.jpg" /></div> 
    <div><img src="http://marktyrrell.com/labs/blueberry/img/slide3.jpg" /></div> 
    <div><img src="http://marktyrrell.com/labs/blueberry/img/slide4.jpg" /></div> 
  </div> 
</div>

 아이다운 2013.06.13 12:06:07

해당파일의 index 를 열어보면, 이미지가 밑으로 쭉 나열만되네요.. 혹 확인 되시는분.. 익스랑 크롬에서 열어보았습니다.

182.♡.33.73

 참없다 2013.06.13 16:50:33

<link rel="stylesheet" href="./blueberry/blueberry.css" /> 
<style type="text/css"> 
<!-- 
.blueberry { max-width: 960px; } 
--> 
</style> 
  
<script src="./blueberry/jquery.blueberry.js"></script> 
<script> 
$(window).load(function() { 
$('.blueberry').blueberry(); 
}); 
</script> 

<div class="blueberry"> 
<div class="slides"> 
<div><img src="<?=$g4[path]?>/img/main1.jpg" border="0" /></div> 
<div><img src="<?=$g4[path]?>/img/main2.jpg" border="0" /></div> 
<div><img src="<?=$g4[path]?>/img/main3.jpg" border="0" onclick="location='<?=$g4[shop_path]?>/event.php?ev_id=1349855253'"/></div> 
<div><img src="<?=$g4[path]?>/img/main4.jpg" border="0" onclick="location='<?=$g4[shop_path]?>/event.php?ev_id=1349854784'"/></div> 
</div> 
</div>

내 적용의 경우

블루베리 모바일웹

<link rel="stylesheet" href="css/blueberry.css" />

<script src="js/jquery.blueberry.js"></script> 

   

<script type="text/javascript">

$(window).load(function() { 

$('.blueberry').blueberry(); 

}); 

</script>

<style>

 .blueberry { max-width: 960px; }

</style>

<div class="blueberry"> 

 <div class="slides">

이미지

</div></div>

하고자 하는 것이 아니라서 사용 안함.

사진에 상단 부분에 큰 이미지 자동으로 바뀌는 소스