如图:

代码:

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

JQuery------实现鼠标点击和滑动不同效果的更多相关文章

  1. 基于jQuery CSS3鼠标点击动画效果

    分享基于jQuery CSS3鼠标点击动画效果支持图片或内容滑动,允许设置动画延迟效果.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class="co ...

  2. JavaScript与jQuery关于鼠标点击事件

    即实现鼠标点击其中一个菜单发生样式的改变,当点击下一个菜单时,当前菜单样式改变,其他菜单均变为之前样式. 用JavaScript,jQuery都可以实现,只是后者是封装的JavaScript库,具有s ...

  3. (二)Three光线检测-实现摄像机向鼠标点击位置滑动动画

    (二)Three.js光线检测 摘要:使用three.js中的光线检测 Raycaster() ,实现一下效果: 通过点击处的坐标,修改摄像机位置,实现摄像机由远及近的过渡动态效果(由远景到近景) 1 ...

  4. jQuery模拟鼠标点击事件失效的问题

    最近使用jQuery操作浏览器获取数据,需要对分页的信息进行处理,发现直接使用$('div#pager a.next').click();的这种写法无法触发点击事件. 使用trigger('click ...

  5. 使用jQuery实现点击左右滑动切换特效

    使用jQuery实现点击左右滑动切换特效: HTML代码如下: <!--整体背景div--> <div class="warp"> <!--中间内容d ...

  6. 【WPF】点击滑动条(Slider),移动滑块(Tick)到鼠标点击的位置

    问题:点击Slider控件时,滑块会自动跳到滑动条的最边缘位置,无法跳到鼠标点击的位置上. 办法:给Slider控件设置属性IsMoveToPointEnabled="True"即 ...

  7. 基于jquery鼠标点击图片翻开切换效果

    基于jquery鼠标点击图片翻开切换效果是一款基于jQuery+CSS3实现的点击图片切换特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class=&quo ...

  8. 基于jQuery鼠标点击弹出登陆框效果

    基于jQuery鼠标点击弹出登陆框效果.这是一款扁平样式风格的jQuery弹出层登陆框特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <input type=" ...

  9. jQuery 二级菜单,一次显示一个小类 鼠标点击显示小类

    jQuery 二级菜单,一次显示一个小类 鼠标点击显示小类 本例有另外2个关联案例,演示地址分别为2.php,3.php 演示 XML/HTML Code <div class="ar ...

随机推荐

  1. Android蓝牙——HID开发

    代码地址如下:http://www.demodashi.com/demo/13891.html 原文地址: https://blog.csdn.net/VNanyesheshou/article/de ...

  2. RDS for MySQL 如何使用 Percona Toolkit

    Percona Toolkit 包含多种用于 MySQL 数据库管理的工具. 下面介绍常用的 pt-online-schema-change  和  pt-archiver 搭配 RDS MySQL ...

  3. PHP Token(令牌)设计应用

    转自:http://my.oschina.net/u/912810/blog/358973 <?php class GEncrypt { protected static function ke ...

  4. C#: 数字经纬度和度分秒经纬度间的转换

    using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace Cons ...

  5. C#:Ini文件操作(待补充)

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.R ...

  6. HDU 4946 Area of Mushroom 共线凸包

    题意是在二维平面上 给定n个人 每一个人的坐标和移动速度v 若对于某个点,仅仅有 x 能最先到达(即没有人能比x先到这个点或者同一时候到这个点) 则这个点称作被x占有 若有人能占有无穷大的面积 则输出 ...

  7. B/S打印解决方案参考

    使用Lodop 插件,该插件占用8000端口,未使用过,仅知依赖浏览器打印 http://blog.csdn.net/harderxin/article/details/17262945 强大的web ...

  8. django Models cross file ---- 跨app引用文件

    一.django 的跨app引用文件是通过import 来实现的,但是import 的路径查找和标准的import 不太一样,django里面更加方便了 二.例子 1.project 结构说明 [ji ...

  9. mem_fun与mem_fun_ref的区别

    一句话:container<ClassType*>就用mem_fun,container<ClassType>就用mem_fun_ref 参考: http://www.cplu ...

  10. 解决:Access denied for user 'root'@'localhost' (using password: YES)

    症状: 重新安装了MySQL,改变了root的密码,因此,在java代码中修改了某个DatabaseConnectionImpl的DBPASSWORD 在java中写了一些代码测试MySQL的插入和查 ...