1. 首頁
  2. 問答
  3. jQuery內容滑塊 - 沒有按鈕/淡入和淡出轉換

jQuery內容滑塊 - 沒有按鈕/淡入和淡出轉換

2012-10-19 103 views
0

相當基本的問題，但我正在尋找一個jQuery內容滑塊，沒有任何按鈕只是連續淡入/淡出4個不同段落的內容。jQuery內容滑塊 - 沒有按鈕/淡入和淡出轉換

我在Google上完成了我的搜索，看起來似乎找不到那個會做我想做的事情的滑塊 - 我希望有人能在這裏推薦一個。

在此先感謝。

來源

2012-10-19 user1571757

回答

0

我覺得NivoSlider是你要搜索的內容，當你希望只使用圖像/視頻。

它在這裏可用：http://nivo.dev7studios.com/support/jquery-plugin-usage/ 當您向下滾動頁面時，您將看到顯示控件的真/假選項。

如果你想使用html內容，我聽說的最後一件事是nivoslider不能這樣做。

所以，如果你想使用的幻燈片裏的html內容，則可以嘗試這裏的rhinoslider： http://rhinoslider.com/how-to-use/ 在鏈接頁面，你可以使用演示，以滿足您的需求。

多一點信息會很好，但。它應該是響應和事情？你想要展示什麼內容？

希望本貼幫助。

問候， 多米尼克

來源

2012-10-19 10:00:25 Dominik

0

你可以看到從我附上的鏈接選項選擇不同的過渡效果........

<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br"> 
<head> 
    <title>Skitter - Slideshow for anytime!</title> 
    <link href="css/skitter.styles.css" type="text/css" media="all" rel="stylesheet" /> 
    <script src="js/jquery-1.6.3.min.js"></script> 
    <script src="js/jquery.easing.1.3.js"></script> 
    <script src="js/jquery.skitter.min.js"></script> 
    <script> 
    $(document).ready(function() { 
     var options = { 
      numbers: false,// the thing required no anchoring or navigation 
      navigation:false, 
      animation: "random", 
      velocity:0.2, //velocity of animation 
      interval:4000// time gap between the transitions 
     }; 
     $('.box_skitter_large').skitter(options); 
    }); 
    </script> 
</head> 
<body> 
<div id="page"> 
    <div id="content"> 
     <div class="border_box" style="width:200px" > 
      <div class="box_skitter box_skitter_large" style="margin-left:152px;margin-top:34px"> 
       <ul> 
        <li><a href="#cube"><img src="images/1.jpg" class="cube" /></a><div class="label_text"><p>cube</p></div></li> 
        <li><a href="#cubeRandom"><img src="images/2.jpg" class="cubeRandom" /></a><div class="label_text"><p>cubeRandom</p></div></li> 
        <li><a href="#block"><img src="images/3.jpg" class="block" /></a><div class="label_text"><p>block</p></div></li> 
        <li><a href="#cubeStop"><img src="images/4.jpg" class="cubeStop" /></a><div class="label_text"><p>cubeStop</p></div></li> 
        <li><a href="#cubeHide"><img src="images/5.jpg" class="cubeHide" /></a><div class="label_text"><p>cubeHide</p></div></li> 
       </ul> 
      </div> 
     </div> 
    </div> 
</div> 
</body> 
</html>

下載的JS和CSS文件，並看到不同的過渡效果訪問： http://thiagosf.net/projects/jquery/skitter/

來源

2012-10-19 10:08:12 Raghurocks

相關問題

 相關問題