标签鼠标移动切换标签栏

标签

<div class="actnav">
            <ul>
                <li class="cur">参赛作品</li>
                <li>参与方式</li>
                <li>参赛要求</li>
                <li>奖项设置</li>
            </ul>
            <p>注意：大赛将分为四次评选，分别在4月、5月、6月31日前为月度评选，7月10日-15日为总决赛评选。</p>

            <p><a href="#list" class="hpfr">> 查看参赛作品要求 <</a></p>
        </div>

标签栏

<div class="sub">
<div class="wp cl">
    <div class="sub_hd">
        <h5>活动简介</h5>
    </div>
    <div class="jianjie">
        <p>
            互联网移动通信的高速发展，汕头联通喜迎4G时代的到来，为向广大移动用户宣传4G网络不可比拟的“传输高质量视频图像”优越性，感受互联网移动通信时代给人们日常生活带来日新月异的科学应用，携手汕头摄影家协会联合举办汕头联通手机摄影大赛。本次大赛以“喜迎4G时代，汕头沃精彩”为主题，围绕精致汕头、智慧汕头，建设理想美丽幸福家园为主题内容，作品以记录汕头城市发展和历史文化的精彩瞬间、体现社会的和谐发展为主旨，以社会纪实摄影为主，兼顾人文风俗、景观。<br>
            通过本次手机摄影大赛，为广大爱好摄影的客户搭建一个展示才华、互动交流的平台，利用4G网络优势将摄影与联通网络相结合，宣传网络优势，让更多用户体验到联通4G的优质网络服务。</p>
    </div>
    <div class="mt20">
        <div class="sub_hd">
            <h5>月度入选获奖作品</h5>
        </div>
        <ul class="kwicks">
            <li id='panel-1'></li>
            <li id='panel-2'></li>
            <li id='panel-3'></li>
            <li id='panel-4'></li>
            <li id='panel-5'></li>
            <li id='panel-6'></li>
            <li id='panel-7'></li>
            <li id='panel-8'></li>
        </ul>
    </div>
</div>
<div class="wp cl" style="display:none;">
    <!-- <div class="sub_hd">
    <h5>大赛概括</h5>
    <p>冠名：中国联通汕头分公司<br>联合主办：中国联通汕头分公司 蓝色河畔 </p>
    </div> -->
    <div class="sub_hd">
        <h5>参与方式</h5>

        <p>
            <img src="source/plugin/votesys/template/20140404liantong/images/cyfs.png">
        </p>
    </div>
</div>
<div class="wp cl" style="display:none;">
    <div class="sub_hd">
        <h5>参赛要求</h5>

        <p>
            1、参赛作品的内容必须体现积极健康、和谐进步的作品为佳，不得含有低级趣味等不健康内容，不存在抄袭与作弊。<br>
            2、本次活动作品要求采用手机拍摄，参赛作品要求真实记录，除对影调、色彩进行适度调整及构图剪裁外不得修改原始影像，非手机拍摄或经过电脑加工制作的作品，将被取消参赛资格（必须保留完整的照片信息）。<br>
            3、参赛作品规格为800*600以上的像素，格式为JPE或GIF，数量不限；作品需注明作品名称、作者姓名、联系电话、微信、qq、邮箱，资料不齐，恕不评选；<br>
            4、所有入选获奖作品，主办单位有使用权（包括用于展览、出版物、媒体网络宣传等），不另付稿酬。所有入选获奖作品如涉及著作权、版权、肖像权或名誉权纠纷，均由作者本人负责。<br>
            5、投稿者均视为同意并遵守以上各条规定。凡存在著作权问题，违背以上规定，主办单位有权取消其参赛参展资格。<br>
        </p>
    </div>
    <div class="sub_hd">
        <h5>大赛时间</h5>

        <p>
            活动时间：2014年4月-2014年7月
        </p>
    </div>
</div>
<div class="wp cl" style="display:none;">
    <div class="sub_hd">
        <h5>
            奖项设置
        </h5>
    </div>
    <div class="jplist cl">
        <ul>
            <li>
                <div class="jpimg"><img src="source/plugin/votesys/template/20140404liantong/images/jpimg.png"></div>
                <h4>一等奖<i>(1名)</i></h4>

                <p>小米3手机一部</p></li>
            <li>
                <div class="jpimg"><img src="source/plugin/votesys/template/20140404liantong/images/jpimg1.png"></div>
                <h4>二等奖<i>(2名)</i></h4>

                <p>红米手机一部</p></li>
            <li>
                <div class="jpimg"><img src="source/plugin/votesys/template/20140404liantong/images/jpimg2.png"></div>
                <h4>三等奖<i>(5名)</i></h4>

                <p>无线上网卡半年（不含设备）</p></li>

            <li>
                <div class="jpimg"><img src="source/plugin/votesys/template/20140404liantong/images/jpimg4.png"></div>
                <h4>人气奖<i>(20名)</i></h4>

                <p>充值卡100元 </p></li>
            <li>
                <div class="jpimg"><img src="source/plugin/votesys/template/20140404liantong/images/jpimg5.png"></div>
                <h4>双月度入选奖<i>(90名)</i></h4>

                <p>充值卡50元</p></li>
        </ul>
    </div>
</div>
</div>

jqery代码

jq('.actnav li').hover(function () {
        jq(this).addClass('cur').siblings().removeClass('cur');
        jq('.sub .wp').eq(jq(this).index()).show().siblings().hide();
    });