常用JS效果需要时更新。。。

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

1、手风琴效果

JS:

$(function() {
    var aMenuOneLi = $(".menu-one > li");
    var aMenuTwo = $(".menu-two");
    $(".menu-one > li > .header").each(function(i) {
        $(this).mouseover(function() {
            //mouseover：鼠标悬停；click：点击
            if ($(aMenuTwo[i]).css("display") == "block") {
                //$(aMenuTwo[i]).slideUp(300);
                //$(aMenuOneLi[i]).removeClass("menu-show");
                //$(aMenuOneLi[i]).addClass("firstChild");
            } else {
                for (var j = 0; j < aMenuTwo.length; j++) {
                    $(aMenuTwo[j]).slideUp(300);
                    //$(aMenuOneLi[j]).removeClass("menu-show");
                }
                $(aMenuTwo[i]).slideDown(300);
                //$(aMenuOneLi[i]).removeClass("firstChild");
            }
        });
    });
});

事例：

<ul class="menu-one">
    <li>
        <a class="header" href="imageList.aspx?NodeCode=00050001">钨与稀土质检</a>
        <dl class="menu-two">
            <dt>
                sdfsdf
            </dt>
            <dt>
                sdfsdf
            </dt>
        </dl>
    </li>
    <li>
        <a class="header" href="imageList.aspx?NodeCode=00050002">钨与稀土研究</a>
        <dl class="menu-two">
            <dt>
                sdfsdf
            </dt>
            <dt>
                sdfsdf
            </dt>
        </dl>
    </li>
    <li>
        <a class="header" href="imageList.aspx?NodeCode=00050003">钨与稀土培训</a>
        <dl class="menu-two">
            <dt>
                sdfsdf
            </dt>
            <dt>
                sdfsdf
            </dt>
        </dl>
    </li>
</ul>

2、tab切换

JS：

// tab共用参数
function cutover(id,etype){
var tabContainer = $("#"+id).find(".tabContainer");
var panelContainer = $("#"+id).find(".panelContainer");
tabContainer.find("dl>dt").each(function(i,e){
if (etype=="1"){
$(e).hover(function(){
tabContainer.find("dl>dt").removeClass("on");
$(e).addClass("on");
panelContainer.children("div").hide();
panelContainer.children("div").eq(i).show();
});
}
if (etype=="2"){
$(e).click(function(){
tabContainer.find("dl>dt").removeClass("on");
$(e).addClass("on");
panelContainer.children("div").hide();
panelContainer.children("div").eq(i).show();
});
}
});
};

事例：

<div class="centerLeft1" id="news_box">
<div class="tabContainer">
<dl>
<dt class="">
成功案例
</dt>
<dt class="on">
行业新闻
</dt>
</dl>
</div>
<div class="panelContainer">
<div class="cgal" style="display: none;">
tab1
</div>
<div class="cgal" style="display: block;">
tab2
</div>
</div>
</div>//调用函数
$(document).ready(function() {
cutover("news_box", '1');
cutover("news_box2", '1');
});

3、JS获得URL参数

4、设为首页

5、加入收藏夹

6、简繁体转换

事例：

7、jQuery attr css 赋值，获取

$("#left_117").attr("class", "menu-show"); //attr定义标签自带的属性，比如：class，
$("#ft_117").css("display", "block"); //css定义style里的元素$("#left_117").attr("class"); //获取标签自带属性的值，比如：class，
$("#ft_117").css("display"); //获取 style里的元素的值，比如display,width...