如图:

代码:

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. 摘:通过ICursor对Table进行操作(添加、修改、删除)

    通过ICursor对Table进行操作(添加.修改.删除) 连接上数据表的目的就是对其进行包括浏览.添加.修改.删除等基本操作. 浏览功能,之前文章中一提到,就是将Itable转换为DataTable ...

  2. 给Editplus去掉.bak文件

    Tools-->Configure User Tools-->Files-->去掉create bacup file when saving前复选框的对号.

  3. 使用SOCKET实现TCP/IP协议的通讯

    一.原理: 首先要理解基本的原理,2台电脑间实现TCP通讯,首先要建立起连接,在这里要提到服务器端与客户端,两个的区别通俗讲就是主动与被动的关系,两个人对话,肯定是先有人先发起会话,要不然谁都不讲,谈 ...

  4. xdebug安装教程

    自动分析应该下载的文件: http://xdebug.org/wizard.php

  5. Redis(十二):redis两种持久化方法对比分析

    前言 最近在项目中使用到Redis做缓存,方便多个业务进程之间共享数据.由于Redis的数据都存放在内存中,如果没有配置持久化,redis重启后数据就全丢失了,于是需要开启redis的持久化功能,将数 ...

  6. jsp学习之scriptlet的使用方法

    scriptlet的使用 jsp页面中分三种scriptlet: 第一种:<%  %>  可以在里面写java的代码.定义java变量以及书写java语句. 第二种:<%! %> ...

  7. 安装CentOS版本的yum(转载)

    安装CentOS版本的yum 下载源:http://mirrors.163.com/centos/6/os/i386/Packages/ 材料准备: python-iniparse-0.3.1-2.1 ...

  8. MapReduce原理<转>

    江湖传说永流传:谷歌技术有"三宝",GFS.MapReduce和大表(BigTable)! 谷歌在03到06年间连续发表了三篇很有影响力的文章,分别是03年SOSP的GFS,04年 ...

  9. 用Netty开发中间件:高并发性能优化(转)

    用Netty开发中间件:高并发性能优化 最近在写一个后台中间件的原型,主要是做消息的分发和透传.因为要用Java实现,所以网络通信框架的第一选择当然就是Netty了,使用的是Netty 4版本.Net ...

  10. 因客户机IP与服务器IP不在同一网段导致无盘客户机开机卡tftp,提示:PXE-E11: ARP timeout

    61的地址需要在上面的地址范围段之内 问题现象] 无盘客户机启动获取DHCP后卡在tftp界面提示:PXE-E11: ARP timeout,如下图: [原因说明] 客户机的IP地址与服务器IP地址不 ...