jQuery 슬라이드 쇼를 시작한 후 크기 조정이 작동하지 않습니까?

jQuery 슬라이드 쇼를 만들고 같은 크기의 이미지 6 개를 가져 와서 CSS 코드에서 100 %로 설정하여 창 크기를 조정합니다 (전체 화면 슬라이드 쇼). 그러나 일단 클릭하면 슬라이드 쇼가 시작되고 크기 조정은 더 이상 작동하지 않습니다. 이미지는 첫 번째 크기 조정 이후의 크기로 유지되며 변경되지 않습니다. 나는 다른 jQuery 플러그인으로 놀랐다. 나의 필요에 맞는 플러그인을 찾을 수없는 것 같다. 가능하다면, 다른 jQuery 라이브러리를 추가하는 것을 피하고 싶습니다. Cycle 라이브러리, jQuery 바닐라, CSS, 자바 스크립트, HTML 등으로이 문제를 해결하십시오.jQuery 슬라이드 쇼를 시작한 후 크기 조정이 작동하지 않습니까?

다음은 현재 코드입니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Lorena Gaxiola</title> 
<style type="text/css"> 
body {background: #222; font-family:Georgia, "Times New Roman", Times, serif; font-size:11px; margin:50px; color:#999} 
ul li{line-height:20px;} 
.new{margin-top:15px} 
a{color:#fff; text-decoration:none; font-style:italic;} 
a:hover{text-decoration:underline} 
h1{font-size:16px; text-transform:uppercase; font-weight:normal; color:#fff; letter-spacing:1px;} 
h2{font-size:12px; text-transform:uppercase; font-weight:normal; color:#999; letter-spacing:1px;} 
#myslides img {height:100%; width:100%;} 
</style> 

<script type="text/javascript" src="jquery/jquery-1.10.1.js"></script> 
<script type="text/javascript" src="jquery/jquery.cycle.all.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    $('#myslides').cycle({ 
    fx: 'fade', 
    speed: 10, 
    next: '#myslides', 
    timeout: 0, 

}); 
}); 
</script> 
</head> 
<body> 
<center> 
<div id="myslides"> 

<div id="img 1"> 
<center> 
<img src="img/1.jpg"/> 
</center> 
</div> 


<div id="img 2"> 
<center> 
<img src="img/2.jpg"/> 
</center> 
</div> 


<div id="img 3"> 
<center> 
<img src="img/3.jpg"/> 
</center> 
</div> 


<div id="img 4"> 
<center> 
<img src="img/4.jpg"/> 
</center> 
</div> 


<div id="img 5"> 
<center> 
<img src="img/5.jpg"/> 
</center> 
</div> 


<div id="img 6"> 
<center> 
<img src="img/6.jpg"/> 
</center> 
</div> 


</div> 
</center> 
</body> 
</html>

출처

2013-06-26 qaxf6auux

누군가가 대답하기 전에 실제로 알아낼 수있었습니다. 정말 간단한 수정, 그냥과 같이, 사이클 옵션

resizeContainer: false, 
slideResize: false

를 추가

$(document).ready(function(){ 
    $('#myslides').cycle({ 
     fx: 'fade', 
     speed: 10, 
     next: '#myslides', 
     timeout: 0, 
     resizeContainer: false, 
     slideResize: false 

    }); 
});

출처

2013-06-26 23:51:03 qaxf6auux

jQuery 슬라이드 쇼를 시작한 후 크기 조정이 작동하지 않습니까?

답변

관련 문제