鼠标移出隐藏当前，点击触发下一个事件

2019独角兽企业重金招聘Python工程师标准>>>

当几点span标签可以显示span边框，鼠标移出隐藏当前，显示下一个span border：

 

css part：

 .l_one span{border:1px solid #fff;float:left;width:282px;display:inline-block;margin:15px 0 0 10px;padding:0 0 10px 10px;}{备注：这里设置1px的白色边框是为了去掉FF下的1px偏移之差，ok}

JQ如下：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

    <script type="text/javascript">
    jQuery(document).ready(function($){
        var _oldStyle = {
            color: '',
            border: ''
        };
        $(".l_one span").css("border","1px solid #fff");
        $(".l_one span").hover(function() {
            $(this).css("border","1px solid #d89647");
        }, function () {
            $(this).css("border","1px solid #fff");
        });

    });

HTML:

<div class="l_one">
          <span>
           <h3>杭州本地群组</h3>
           <a href="">上城 </a>
           <a href="">|下城 |</a>
           <a href="">江干 |</a>
           <a href="">拱墅 |</a>
           <a href="">西湖|</a>
           <a href="">富阳 |</a>
           <a href="">淳安 |</a>
           <a href="">余杭 |</a>
           <a href="">萧山 |</a>
           <a href="">滨江 |</a>
           <a href="">建德 |</a>
           <a href="">临安 |</a>
        </span>
        <span class="one_right">
            <h3>地区群组</h3>
            <a href="">湖南 |</a>
            <a href="">湖北 |</a>
            <a href="">东北 |</a>
            <a href="">江西 |</a>
            <a href="">广西 |</a>
            <a href="">广东 |</a>
            <a href="">浙江 |</a>
            <a href="">福建 |</a>
            <a href="">河北 |</a>
            <a href="">山东 |</a>
            <a href="">江苏 |</a>
            <a href="">安徽 |</a>
            <a href="">山西 |</a>
            <a href="">河南 |</a>
            <a href="">贵州</a>
          </span>
        </div>

转载于:https://my.oschina.net/glelaine/blog/16902