所有,問題在雲轉盤
林將jQuery非常新,我想結合「雲旋轉木馬」在另一個jQuery插件插件(與變灰背景jQuery的彈出式)。但是,我正在努力使其工作。
雖然通常在您的網站上看到的是「Cloud Carousel」,但在我的實現中,所有圖像都坐在彼此的頂部,就好像它們坐在一個堆疊中並逐個顯示最佳。任何指導新手請嗎?
最佳, 這裏是代碼下面
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<link href="facebox.css" media="screen" rel="stylesheet" type="text/css" />
<link href="css/example.css" media="screen" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<script src="facebox.js" type="text/javascript"></script>
<script type="text/javascript" src="js/cloud-carousel.1.0.4.js"></script>
<script type="text/javascript" src="js/cloud-carousel.1.0.4.min.js"></script>
<script type="text/javascript" src="js/jquery.mousewheel.js"></script>
<script type="text/javascript" src="js/jquery.mousewheel.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('a[rel*=facebox]').facebox({
loadingImage : 'images/loading.gif',
closeImage : 'images/close.png'
})
$("#carousel1").CloudCarousel(
{
xPos: 170,
yPos: 40,
buttonLeft: $("#left"),
buttonRight: $("#right"),
altBox: $("#alt-text"),
titleBox: $("#title-text")
}
);
})
</script>
</head>
<body>
<div class="example">
<p> <a href="#info" rel="facebox">Templates</a> </p>
</div>
<div id="info" style="display:none;">
<div id = "carousel1" style="width:400px; height:200px;position: relative;overflow:scroll;">
<img class = "cloudcarousel" src="button_images/1.png" alt="Flag 1 Description" title="Flag 1 Title" width="100px" height="100px" />
<img class = "cloudcarousel" src="button_images/10.png" alt="Flag 2 Description" title="Flag 2 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/11.png" alt="Flag 3 Description" title="Flag 3 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/14.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/18.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/19.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/2.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/20.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/21.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/4.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/5.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/6.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/7.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<img class = "cloudcarousel" src="button_images/8.png" alt="Flag 4 Description" title="Flag 5 Title" width="100px" height="100px"/>
<button id="left"> Left</button>
<button id="right" onclick="alert('right')">Right</button>
</div>
</div>
</body>
</html>
Thnxs費德里科,我已經實現了自己的想法,它的工作,但現在我的功能不能正常工作,我已經上傳的代碼,請幫我出,應非常感謝你.. – Zain 2011-01-31 05:13:04