ps:箭头是字体图标,需要的可以去阿里字体下载,也可自己替换图片

点击之后的

代码部分

<ul class="Ep_sxxz">
<span class="eponset">排序顺序:</span>
<li class="ep_xz">按租金 <i class="iconfont icon-jiantou"></i></li>
<li>按面积 <i class="iconfont icon-jiantou1"></i></li>
<li>按时间 <i class="iconfont icon-jiantou1"></i></li>
<li>按热度 <i class="iconfont icon-jiantou1"></i></li>
</ul>
$(".Ep_sxxz li").click(function(){
$(this).addClass("ep_xz").siblings().removeClass("ep_xz");
if($(this).children("i").is('.icon-jiantou')){
$(this).children("i").removeClass("icon-jiantou").addClass("icon-jiantou1");
}else if($(this).children("i").is('.icon-jiantou1')){
$(this).children("i").removeClass("icon-jiantou1").addClass("icon-jiantou");
}
})

jquery仿排列顺序,变换颜色更换class的更多相关文章

  1. jquery仿淘宝规格颜色选择效果

    jquery实现的仿淘宝规格颜色选择效果源代码如下 jquery仿淘宝规格颜色选择效果 -收缩HTML代码 运行代码 [如果运行无效果,请自行将源代码保存为html文件运行] <script t ...

  2. jquery 仿手机屏幕切换界面效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. JQuery仿购物网站放大镜特效所遇问题及思考

    JQuery仿购物网站放大镜特效所遇问题及思考 先贴下效果图,然后描述起来也就不会不知道我在说什么了. 我碰到的问题一: 一开始我自己总结了是因为两个小原因导致的①使用了mouseover,mouse ...

  4. jquery仿搜狐投票动画代码

    体验效果:http://hovertree.com/texiao/jquery/21/ 这是一款基于jquery实现的仿搜狐投票动画特效源码,运行该源码可见VS图标首先出现在中间位置,紧接着随着投票比 ...

  5. jQuery仿阿里云购买选择购买时间长度

    效果:http://hovertree.com/texiao/jquery/61/ jQuery仿阿里云购买服务器选择时间长度,操作简单,只需点击所要选的时间段 代码: <!doctype ht ...

  6. 计算机中的颜色XIV——快速变换颜色的V分量

    基本知识回顾: 计算机中的颜色Color,用RGB模式存储(用R.G.B三个分量表示颜色,每个分量的范围是0—255). 而计算机中的颜色除了用RGB模式表示以外,常见的还有HSV模式(或者是HSB. ...

  7. 一款基于jQuery仿淘宝红色分类导航

    今天给大家分享一款基于jQuery仿淘宝红色分类导航.这款分类导航适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预览    ...

  8. 一款jQuery仿海尔官网全屏焦点图特效代码

    一款jQuery仿海尔官网全屏焦点图特效代码,带有左右箭头的jQuery焦点图切换特效. 当焦点图切换时,下方的三块小图也相对应的进行切换.并且特效还兼容头疼的IE6.赶快去和谐了它吧! 适用浏览器: ...

  9. jquery仿alert提示框、confirm确认对话框、prompt带输入的提示框插件[附实例演示]

    jquery仿alert提示框.confirm确认对话框.prompt带输入的提示框插件实例演示 第一步:引入所需要的jquery插件文件: http://www.angelweb.cn/Inc/eg ...

随机推荐

  1. Linux基本命令讲解

    前言 不多BB,直接上图 Linux命令行的组成结构 [root@oldwang ~]# [root@oldwang ~]# [root@oldwang ~]# [root@oldwang ~]# [ ...

  2. PAT甲级题分类汇编——树

    本文为PAT甲级分类汇编系列文章. AVL树好难!(其实还好啦~) 我本来想着今天应该做不完树了,没想到电脑里有一份讲义,PPT和源代码都有,就一遍复习一遍抄码了一遍,更没想到的是编译一遍通过,再没想 ...

  3. stm32f103re stop模式下降低功耗

    一端口设置1.将N.C的GPIO统一配置为GPIO_Mode_AIN: 2.检查输入引脚,按照不工作时候的状态相应配置为  IPD/IPU,即避免在内部上/下拉电阻上消耗电流,而且该电流理论值为VCC ...

  4. 递推问题 hdu 2046 与1143的比对

    2046 在2×n的一个长方形方格中,用一个1× 2的骨牌铺满方格,输入n ,输出铺放方案的总数.例如n=3时,为2× 3方格,骨牌的铺放方案有三种,如下图:   Input 输入数据由多行组成,每行 ...

  5. Mac下Sublime Text3激活码

    方法1: 终端中打开文件 /etc/hosts,插入如下语句 127.0.0.1 www.sublimetext.com 127.0.0.1 license.sublimehq.com 方法2: 在s ...

  6. C#插入时间

    //获取日期+时间 DateTime.Now.ToString(); // 2008-9-4 20:02:10 DateTime.Now.ToLocalTime().ToString(); // 20 ...

  7. openstack-neutron(2)

    VXLAN 独立于底层的网络拓扑:反过来,两个 VTEP 之间的底层 IP 网络也独立于 VXLAN.VXLAN 数据包是根据外层的 IP header 路由的,该 header 将两端的 VTEP ...

  8. 在vue项目中使用live2d

    成品如图: 那么几步简单说明怎么用吧: 第一,先去github上下载相应的静态资源: https://github.com/xiazeyu/live2d-widget-models 第二,将packg ...

  9. java 原子操作(1) CAS

    在 java 多线程编程中经常说的就是:“原子操作(atomic operation) 不需要 synchronized”. 原子操作指的是不会被线程调度机制打断的操作:这种操作一旦开始,就一直运行到 ...

  10. String.getBytes()方法中的中文编码问题

    得到一个操作系统默认的编码格式的字节数组.这表示在不同的操作系统下,返回的东西不一样! byte[] a= "中".getBytes() String.getBytes(Strin ...