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" });
});

 

posted @ 2017-02-10 16:23  玉天恒  阅读(919)  评论(0编辑  收藏  举报