zoukankan      html  css  js  c++  java
  • JQuery------实现鼠标点击和滑动不同效果

    如图:

    代码:

    html

    <ul class="price-brand-right">
      @foreach (Brand item in ViewBag.Brand)
      {
        <li class="li-brand" style="cursor:pointer;">@item.name<input type="hidden" value="@item.brandid"></li>
      }
    </ul>

    js

    //品牌鼠标移动
    $(".li-brand").hover(function () {
      var b = $(this).css("fontWeight");
      if (b.indexOf("bold") != -1) {
        return false;
      }
      $(this).css({ "color": "red", "text-decoration": "underline" });
    }, function () {
      var b = $(this).css("fontWeight");
      if (b.indexOf("bold") != -1) {
        return false;
      }
      $(this).css({ "color": "#666", "text-decoration": "none" });
    });
    
    //品牌点击
    $(".li-brand").click(function () {
      $(this).css({ "color": "green", "fontWeight": "bold", "text-decoration": "none" });
      $(this).prevAll("li").css({ "color": "#666", "fontWeight": "normal" });
      $(this).nextAll("li").css({ "color": "#666", "fontWeight": "normal" });
    });
  • 相关阅读:
    python3 内置函数
    python3 模块和包
    python3 面向对象编程
    vue.js的devtools安装
    数组对象排序
    插件资源库
    Vue.js 2.0生命周期
    vue学习--自定义全局vue组件
    搭建VUE项目
    入职新公司
  • 原文地址:https://www.cnblogs.com/tianhengblogs/p/6386907.html
Copyright © 2011-2022 走看看