jQuery全屏圖片點擊滑動切換手風琴效果



121 481 161



特效描述:jQuery 全屏圖片 點擊滑動切換 手風琴效果,jQuery 全屏點擊輪播切換的手風琴效果,兼容IE8以上、主流瀏覽器

代碼結構

1. 引入CSS

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

2. 引入JS

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/demo.js"></script>

3. HTML代碼

<div class="i_zgs">
<div class="izgsc dib_fz">
            <div class="i_zgs_li js_wzgs" style="background:url(images/t1.jpg) top center no-repeat;"><div class="i_qhan">曼谷<div>&gt;</div></div>
        <div class="i_zgstit" style="display: block;">
            <div class="i_zgsimg"><img src="images/logo1.png" alt=""></div>
            <div class="i_zgsjs"><p>  曼谷國恒設計公司,本著“綜合性、專業化、國際化”的經營理念,立足泰國與東盟,依托中國、面向世界,為社會各界提供建筑設計、規劃設計、策劃資詢、景觀設計等優質服務。</p></div>
        </div>
        <span></span>
        <div class="i_zgsmc" style="display: block;">曼谷國恒設計公司 <p>Bangkok, the constant design company</p></div>
    </div>
    <div class="i_zgs_li" style="background:url(images/t2.jpg) top center no-repeat;"><div class="i_qhan">上海<div>&gt;</div></div>
        <div class="i_zgstit" style="display: none;">
            <div class="i_zgsimg"><img src="images/logo2.png" alt=""></div>
            <div class="i_zgsjs"><p>  上海因恒工程技術有限公司(簡稱:因恒科技)依托于國恒設計強大的技術及人才優勢,由工程設計大師、教授級高工、項目管理專家、IT精英及一大批高度敬業的設計師、工程師組建而成。因恒科技致力于在建筑新技術、新材料、新方法等領域利用工程信息技術為客戶提供更專業的服務。</p></div>
        </div>
        <span></span>
        <div class="i_zgsmc" style="display: none;">上海因恒工程技術有限公司 <p>Shanghai Inhen Engineering Technology Co., Ltd.</p></div>
    </div>
    <div class="i_zgs_li mr0" style="background:url(images/t3.jpg) top center no-repeat;"><div class="i_qhan">美國<div>&gt;</div></div>
        <div class="i_zgstit" style="display: none;">
            <div class="i_zgsimg"><img src="images/logo3.png" alt=""></div>
            <div class="i_zgsjs"><p>  注冊于美國舊金山,專注于新興的城市設計、區域規劃和景觀建筑設計,公司的主創設計人員均畢業于賓夕法尼亞大學、麻省理工大學等優秀學府,并在SWA,Margha Schwartz lnc, SMITH GROUP JJR, EDAW等世界頂級公司工作多年,在美國,歐洲及中國都有在建的或已建成的項目,現在中國上海、杭州、成都設有分公司。</p></div>
        </div>
        <span></span>
        <div class="i_zgsmc" style="display: none;">美國景度景觀規劃公司 <p>landscape architecture palnning urban design</p></div>
    </div>
  </div>  
</div>



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


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

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

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

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

湖北30选5开奖结果走势图表