zoukankan      html  css  js  c++  java
  • Accordion

    //手风琴效果
    <div style="overflow:hidden;height:400px;948px;">
        <div class="J_TWidget" data-widget-config="{&quot;triggerType&quot;:&quot;mouse&quot;,&quot;autoplay&quot;:true,&quot;triggerCls&quot;:&quot;pan_trg&quot;,&quot;panelCls&quot;:&quot;pan_content&quot;,&quot;multiple&quot;:false,&quot;hasTriggers&quot;:true}" data-widget-type="Accordion">
            <div style="height:400px;float:left;margin-left:0px;950px;">
                <div class="pan_trg" style="overflow:hidden;cursor:pointer;height:400px;float:left;30px;background-color:#0088FF;">
                    <span> <a style="font-weight:normal;color:#FFFFFF;line-height:14px;">文字内容</a> </span>
                </div>
                <div class="pan_content" style="overflow:hidden;height:400px;float:left;display:block;830px;">
                     <a href="" target="_blank"> <img  src="//gdp.alicdn.com/imgextra/i3/743621069/T23u.9XgpaXXXXXXXX-743621069.jpg" style="height:400px;830px;" /></a>
                </div>
                <div class="pan_trg" style="overflow:hidden;cursor:pointer;height:400px;float:left;30px;background-color:#FF8000;">
    
                    <span> <a style="font-weight:normal;color:#FFFFFF;line-height:14px;">文字内容</a> </span>
    
                </div>
                <div class="pan_content" style="overflow:hidden;height:400px;float:left;display:none;830px;">
                     <a href="" target="_blank"> <img src="//gdp.alicdn.com/imgextra/i3/743621069/T23u.9XgpaXXXXXXXX-743621069.jpg" style="height:400px;830px;" /></a>
                </div>
                <div  class="pan_trg" style="overflow:hidden;cursor:pointer;height:400px;float:left;30px;background-color:#008000;">
    
                    <a style="font-weight:normal;color:#FFFFFF;line-height:14px;">文字内容</a>
    
                </div>
                <div class="pan_content" style="overflow:hidden;height:400px;float:left;display:none;830px;">
                     <a href="" target="_blank"> <img src="//gdp.alicdn.com/imgextra/i3/743621069/T23u.9XgpaXXXXXXXX-743621069.jpg" style="height:400px;830px;" /></a>
                </div>
                <div  class="pan_trg" style="overflow:hidden;cursor:pointer;height:400px;float:left;30px;background-color:#606060;">
    
                    <a style="font-weight:normal;color:#FFFFFF;line-height:14px;">文字内容</a>
    
                </div>
                <div class="pan_content" style="overflow:hidden;height:400px;float:left;display:none;830px;">
                     <a href="" target="_blank"> <img src="//gdp.alicdn.com/imgextra/i3/743621069/T23u.9XgpaXXXXXXXX-743621069.jpg" style="height:400px;830px;" /></a>
                </div>
            </div>
        </div>
    </div>
    
    
    triggerCls    自定义值    主列表的class值
    panelCls    自定义值    列表所对应的内容列表的class值
    triggerType    mouse/click (默认值:click)    触发方式——
    mouse:鼠标经过触发
    click:鼠标点击触发
    
    multiple    true/false (默认值:false)    是否同时支持多面板展开
    hasTriggers    true/false (默认值:true)    是否设置触发点
  • 相关阅读:
    (OK) Use Android Code to Enable USB Debugging
    add software "mouse cursor" in Android-x86
    Subject: [android-porting] Mouse cursor:issue with dispatchPointer
    BUG实例分析五:binder alloc buf, no vma
    【Manthan, Codefest 18 (rated, Div. 1 + Div. 2) A】Packets
    【ACM-ICPC 2018 南京赛区网络预赛 I】Skr
    【ACM-ICPC 2018 南京赛区网络预赛 A】An Olympian Math Problem
    【AIM Tech Round 5 (rated, Div. 1 + Div. 2) 总结】【题解往前或往后翻,不在这】
    【AIM Tech Round 5 (rated, Div. 1 + Div. 2) A】 Find Square
    【AIM Tech Round 5 (rated, Div. 1 + Div. 2) B】Unnatural Conditions
  • 原文地址:https://www.cnblogs.com/beata/p/5717517.html
Copyright © 2011-2022 走看看