基于jQuery實現快快游戲網左右輪播焦點圖代碼



35 137 46



特效描述:基于jQuery實現 快快游戲網 左右輪播 焦點圖,基于jQuery實現快快游戲網左右輪播焦點圖代碼

代碼結構

1. 引入CSS

<link href="css/zzsc.css" rel="stylesheet" type="text/css" />

2. 引入JS

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

3. HTML代碼

<div id="index_banner">
  <div class="burder">
    <div id="slideBox" class="slideBox">
      <div class="bd">
        <ul>
          <li> <a target="_blank" href="http://51qianduan.com"><img src="images/1.jpg" /></a>
            <div class="burder_content"> <span class="burder_content_type">小編推薦</span> <a target="_blank" href="http://51qianduan.com" class="burder_content_title">夢想微評測新年特別節目《夢想之最年度評選》-最劇情</a>
              <p class="burder_content_content">各位玩家們新年好。夢想微評測新春特別節目《夢想之最年度評選》,在近期就將發布第一集了。敬請各位玩家朋友們期待!</p>
              <a class="burder_content_lookall" target="_blank" href="http://51qianduan.com">進入詳情頁&gt;</a> </div>
          </li>
          <li> <a target="_blank" href="http://51qianduan.com"><img src="images/2.jpg" /></a>
            <div class="burder_content"> <span class="burder_content_type">游戲春晚</span> <a target="_blank" href="http://51qianduan.com" class="burder_content_title">2014游戲地域春晚 眾神云集 超級福利大餐!</a>
              <p class="burder_content_content">由游戲地域工作室制作的“2014游戲地域春晚”節目單近日正式發布。與往年不同,除了傳統的游戲節目之外,本次晚會更是首推payday2游戲短劇,又有各類大牌登場亮相,不可謂不精彩。</p>
              <a class="burder_content_lookall" target="_blank" href="http://51qianduan.com">進入詳情頁&gt;</a> </div>
          </li>
          <li> <a target="_blank" href="http://51qianduan.com"><img src="images/3.jpg" /></a>
            <div class="burder_content"> <span class="burder_content_type">資源下載</span> <a target="_blank" href="http://51qianduan.com" class="burder_content_title">最后一波</a>
              <p class="burder_content_content">Strike Games制作發行的一款第一人稱射擊防御游戲,游戲中玩家需要擊退一波波的敵人,從而升級武器,取得勝利。</p>
              <a class="burder_content_lookall" target="_blank" href="http://51qianduan.com">進入詳情頁&gt;</a> </div>
          </li>
          <li> <a target="_blank" href="http://51qianduan.com"><img src="images/4.jpg" /></a>
            <div class="burder_content"> <span class="burder_content_type">資源下載</span> <a target="_blank" href="http://51qianduan.com" class="burder_content_title">星球探險家</a>
              <p class="burder_content_content">游戲可以在第三和第一視覺間轉換。玩家可以定制自己的角色,組合、創作武器、載具和建筑。同時,玩家必須對抗大量不同智慧程度的敵人并保護幸存的殖民者們。游戲里還會有任務系統,玩家達成npc給予的任務來推動劇情發展;此外游戲還有多人游戲模式,讓玩家們可以聯機一起歷險和搭建。</p>
              <a class="burder_content_lookall" target="_blank" href="http://51qianduan.com">進入詳情頁&gt;</a> </div>
          </li>
          <li> <a target="_blank" href="http://51qianduan.com"><img src="images/5.jpg" /></a>
            <div class="burder_content"> <span class="burder_content_type">小編推薦</span> <a target="_blank" href="http://51qianduan.com" class="burder_content_title">汽車修理工模擬2014</a>
              <p class="burder_content_content">《汽車修理工模擬2014》是一款汽車修理工模擬類游戲。在游戲中玩家要扮演一個新人修理工,在汽車修理廠修改大大小小各式車輛,并在修理完之后進行試駕。</p>
              <a class="burder_content_lookall" target="_blank" href="http://51qianduan.com">進入詳情頁&gt;</a> </div>
          </li>
          <li> <a target="_blank" href="http://51qianduan.com"><img src="images/6.jpg" /></a>
            <div class="burder_content"> <span class="burder_content_type">小編推薦</span> <a target="_blank" href="http://51qianduan.com" class="burder_content_title">擊打節奏</a>
              <p class="burder_content_content">由Zen Studio制作的音樂戰斗游戲《擊打節奏》(KickBeat)已登錄PC的Steam平臺。玩家通過與背景音樂節奏的合拍來完成一系列的武術動作,同時一系列自定義的連招也成為了可能。游戲將包括一系列授權音樂,知名的樂手有Rob Zombie, Marilyn Manson,當然玩家也可以導入自己電腦上的曲目。</p>
              <a class="burder_content_lookall" target="_blank" href="http://51qianduan.com">進入詳情頁&gt;</a> </div>
          </li>
        </ul>
      </div>
      <div class="hd">
        <ul>
          <li><a href="http://51qianduan.com">夢想之最年度評選<img src="images/pmd_hover.gif"/></a></li>
          <li><a href="http://51qianduan.com">2014游戲地域春晚<img src="images/pmd_hover.gif"/></a></li>
          <li><a href="http://51qianduan.com">最后一波<img src="images/pmd_hover.gif" /></a></li>
          <li><a href="http://51qianduan.com">星球探險家<img src="images/pmd_hover.gif" /></a></li>
          <li><a href="http://51qianduan.com">汽車修理工模擬2014<img src="images/pmd_hover.gif" /></a></li>
          <li style="border-right:1px solid #d5d5d5; width:163px;"><a href="http://51qianduan.com">擊打節奏<img src="images/pmd_hover.gif" /></a></li>
        </ul>
      </div>
    </div>
    <script type="text/javascript">jQuery(".slideBox").slide({ mainCell:".bd ul",effect:"left",autoPlay:true} );</script> 
  </div>
</div>
<div style="text-align:center;clear:both">
<br><br>
</div>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 圖片放大鏡 圖片拖動 圖片拖拽 圖片疊加 圖片層疊 圖片翻轉 圖片旋轉 圖片延遲加載 圖片延遲 圖片加載 圖片淡出淡進 圖片淡出 圖片淡進 圖片全屏 頭像上傳 圖片上傳 二維碼 h5圖片動畫 h5圖標動畫 html5圖片動畫 html5圖標動畫 帶縮略圖的幻燈片 地圖 中國地圖 世界地圖 圖片放大縮小 圖片縮放 圖片大小 圖片放大 圖片縮小 圖片變大 圖片變小 滑動 滑塊 滑動門 觸屏滑動 滑動插件 滑塊插件 flash焦點圖 flash幻燈片 flashbanner flash圖片輪播 滾動切換 滾動條切換 滑動選項卡 滑動切換 圖片廣告 圖片切換 圖片選項卡 圖標選項卡 旋轉木馬 圖片旋轉木馬 文字旋轉木馬 旋轉木馬插件 圖片滑動 圖片滑塊 圖片收縮展開 圖片收縮 圖片展開 圖片滾動 圖片滾動條 純圖片輪播 圖片輪播 圖標導航 圖標菜單 自動滾動圖片輪播 選項卡切換 選項卡 切換 tab切換 頁面切換 選項卡插件 切換插件 背景切換 大圖切換 滑動手風琴 手風琴 水平手風琴 垂直手風琴 圖片手風琴 文字手風琴 手風琴插件 滑動星星打分 圖表 焦點圖 幻燈片 輪播圖 bar焦點圖 圖片 圖片插件 頭像截圖 其他 鼠標懸停 滑動選項卡 滑動切換 帶簡介的焦點圖 圖片切換 圖片選項卡 圖標選項卡 選項卡自動切換 圖片切換 切換圖片
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子