jQuery循環插件，自定義尋呼機標籤

我正在模擬一些功能的網站。我正在使用html css和js。我正在使用循環插件循環瀏覽一些我已編寫的選項卡。生病後我的代碼，然後解釋什麼，我試圖做的：jQuery循環插件，自定義尋呼機標籤

我的html：

<div id="content"> 
    <div id="image_selector" class="image_selector"> 
    <div class ="image"> 
     <ul> 
     <li><a id="Mpowered" href="">Mpowered</a></li> 
     <li><a id="Technology" href="">Technology</a></li> 
     <li><a id="Consulting" href="">Consulting</a></li> 
     <li><a id="Outsourcing" href="">Outsourcing</a></li> 
     </ul> 
    </div> 
    </div> 
    <div class="cell"> 
    <div class="description"> 
     <img id="demoimg" src="/home/***/HTML/launch_pad/images/productivity.png" alt="demo pic"/> 
     <h2>Who are we?</h2> 
     <p> a consulting company... ect</p> 
    </div> 


    <div class="description"> 
     <img id="demoimg" src="/home/***/HTML/launch_pad/images/tech1.jpg" alt="tech"/> 
     <h2>We have the tech!</h2> 
     <p> lots of tech!!.... ect</p> 

    </div>

...有兩個部分描述爲每個「一」的標籤現在我已經作出的標籤。

的CSS是這樣的：

.image_selector { 
    border: 1px dotted green; 
    height: 130px; 

} 

.image li { 
    float: left; 
    border: 1px solid white; 
    height: 100px; 
    width: 103px; 
    margin-left: 86px; 
    overflow: hidden; 
    text-align: center; 

} 

.image li a { 
    padding: 74px 0px 0px 0px; 
    color: white; 
    text-shadow: 0 0 0.6em #0197E8; 
    font-size: 17px; 
    letter-spacing: 1px; 
    text-decoration: none; 
    display: block; 
    height: 80px; 
    background-repeat: no-repeat; 
} 

.image li a:hover { 
    text-shadow: 0 0 0.6em #0197E8, 0 0 0.4em #0197E8, 0 0 0.6em #0197E8; 

} 


.image li #Mpowered { 
    background-image: url('/home/ruberto/HTML/launch_pad/images/mpower.png'); 
    background-position: center top; 
} 

.image li #Technology { 
    background-image: url('/home/ruberto/HTML/launch_pad/images/tech.png'); 
    background-position: center top; 

} 

.image li #Consulting { 
    background-image: url('/home/ruberto/HTML/launch_pad/images/consulting.png'); 
    background-position: center top; 

} 

.image li #Outsourcing { 
    background-image: url('/home/ruberto/HTML/launch_pad/images/outsourcing.png'); 
    background-position: center top; 

} 

.cell { 
    border: 1px dashed green; 
    height: 318px; 
    width: 715px; 
    float: left; 

} 

#demoimg { 
    float: left; 
    position: static; 
    margin: 16px 8px 0px 0px; 
    height: 200px; 
    width: 200px; 

}

和JavaScript IAM使用：

$('.cell') 
.before('<div class="image">') 
.cycle({ 
    fx:  'turnDown', 
    speed: 'fast', 
    timeout: 0, 
    pager: '.image' 
});

，所以我必須在網上讀了，現在明白，尋呼機選項現在將創建自己的導航部分正好在div的上面，該部分具有我想要旋轉的內容。我想知道是否有一種方法，我可以只引用「圖像」標籤，我已設置爲我的「標籤」爲單元類的導航功能？

如果沒有辦法，任何人都可以推薦的東西，可以在它的地方工作？

來源

2012-03-23 TheLegend

嘗試發佈您的作品的鏈接。 – rgin 2012-03-23 09:08:32

假設你想引用或者甚至將這些li映射到其他功能，或者甚至建立另一個可引用的尋呼機，這聽起來像你可能需要做的，你可能需要.index爲那些提供參考對連接。

要開始重複尋呼機，克隆其他地方的那些元素，那麼也許只需使用CSS來未顯示原始，但它留在地方，以便循環可以用它來尋呼 //創建二級菜單 $（」 #pager'）。find（'li'）。clone（）。appendTo（'＃navpage ul'）;

然後，如果你要配對你的兩個尋呼機開始使用這一功能 http://jsfiddle.net/moneylotion/KhL3W/

來源

2012-03-27 21:42:11 jnollette

jQuery循環插件，自定義尋呼機標籤

回答

相關問題