<!--默认五星，根据鼠标点击判断-->


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .box{height:40px;padding:10px;}
        .box ul, .box span{float:left;}
        .bg_star{backgroud:url"//这里放没有背景星星的图片地址"}
        .bg_red{backgroud:url"//这里放有背景星星的图片地址"}
    </style>
</head>
<body>
<div class="box">
    <span >评分</span>
    <ul>
        <li class="bg_star bg_red"></li>
        <li class="bg_star bg_red"></li>
        <li class="bg_star bg_red"></li>
        <li class="bg_star bg_red"></li>
        <li class="bg_star bg_red"></li>
    </ul>
</div>
</body>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script>
    var index = $(this).index();
    $(this).addClass('bg_red');
    if(index>0){
        $(this).parent().find('li:lt('+index+')').addClass('bg_red');
        $(this).parent().find('li:gt('+index+')').removeClass('bg_red');
    }else{
        $(this).parent().find('li:gt('+index+')').removeClass('bg_red');
    }
</script>
</html>

类似淘宝五星点评 ，Jquery实现代码的更多相关文章

  1. jquery 实现点评标签 类似淘宝大众点评的 快速准时 货品完好等

    111 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <tit ...

  2. 如何:使用PicturBox实现类似淘宝网站图片的局部放大功能

    转载至http://xuzhihong1987.blog.163.com/blog/static/267315872011822113131823/ 概要: 本文将讲述如何使用PictureBox控件 ...

  3. 写一个类似淘宝的ios app需要用到哪些技术？

    写一个类似淘宝的ios app需要用到哪些技术? 让我想起了有人私信我,说不缺钱,做个类似知乎的东西,包括加运营,需要多少钱. 扯淡结束,正好最近看了一点这方面的东西,也许对题主来说有点帮助. 手机淘 ...

  4. openresty + lua-resty-weedfs + weedfs + graphicsmagick动态生成缩略图（类似淘宝方案）

    openresty + lua-resty-weedfs + weedfs + graphicsmagick动态生成缩略图(类似淘宝方案) --大部分的网站都要涉及到图片缩略图的处理,比如新闻配图,电 ...

  5. 仿淘宝颜色属性选择展示代码（jQuery）

    模仿淘宝商品选择颜色和尺寸的效果,即选择商品颜色和尺寸的时候,把选择的颜色和尺寸放到一个页面容器里面,不足之处,还望指教. <!DOCTYPE HTML> <html lang=&q ...

  6. Zencart先生成订单后付款，类似淘宝后台修改订单价格

    Zencart 使用 Paypal 付款,会出现漏单的情况,即 paypal 已经收到客户的付款,但是网站后台没有客户的订单.导致 paypal 漏单的原因大致会是当客户跳转到Paypal 网站付款完 ...

  7. php提取淘宝URL中ID的代码

    一段可以提取淘宝URL中ID的PHP代码. 例如: <?php $taobao = 'taobao.com'; $tmall = 'tmall.com'; $guojitmall = 'tmal ...

  8. 淘宝网购物车jquery源码和网易新用户注册页面表单验证的练习

    淘宝网购物车源码: <html lang="en"> <head> <meta charset="UTF-8"> <t ...

  9. jquery插件实现鼠标经过图片右侧显示大图的效果(类似淘宝)

    这个插件的名字elevatezoom,网址为http://www.elevateweb.co.uk/image-zoom,在github上的项目首页为https://github.com/elevat ...

随机推荐

  1. Django项目：CRM(客户关系管理系统)--73--63PerfectCRM实现CRM讲师下载作业

    # teacher_urls.py # ————————62PerfectCRM实现CRM讲师讲课记录———————— from django.conf.urls import url from bp ...

  2. 同名的cookie会不会存在多个

    cookie new了多个.同一个名字.会不会存在多个呢. //若果不设置Cookie的path,则名字相同的Cookie视为相同的Cookie,后面的覆盖前面的,注意:大小写敏感 Cookie c1 ...

  3. 机器学习中的隐马尔科夫模型（HMM）详解

    机器学习中的隐马尔科夫模型(HMM)详解 在之前介绍贝叶斯网络的博文中,我们已经讨论过概率图模型(PGM)的概念了.Russell等在文献[1]中指出:"在统计学中,图模型这个术语指包含贝叶 ...

  4. 使用gRPC-Gateway快速构建微服务-双向认证下rpc-gateway使用（同时提供rpc和http接口）

    https://github.com/grpc-ecosystem/grpc-gateway 在grpc之上加一层代理并转发,转变成protobuf格式来访问grpc服务 安装 go get -u g ...

  5. VS未能加载文件或程序集“xxx.dll” 设置Build Events

    完整错误信息:"System.IO.FileNotFoundException"类型的未经处理的异常在 未知模块 中发生 未能加载文件或程序集"Ctp.Core.dll& ...

  6. UOJ#80. 二分图最大权匹配 模板

    #80. 二分图最大权匹配 描述 提交 自定义测试 从前一个和谐的班级,有 nlnl 个是男生,有 nrnr 个是女生.编号分别为 1,…,nl1,…,nl 和 1,…,nr1,…,nr. 有若干个这 ...

  7. Frank Dellaert Slam Speech 20190708

    Georgia Institue of Tecknology 3D Models from Community Databases Spatiotemporal Reconstruction 4D C ...

  8. 图片懒加载插件lazyload.js详解

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  9. PHP实现微信申请退款流程实例源码

    https://www.jb51.net/article/136476.htm 目录 前期准备: 前面讲了怎么实现微信支付,详见博文:PHP实现微信支付(jsapi支付)流程  和ThinkPHP中实 ...

  10. MyEclipse使用总结——MyEclipse10.6 下添加jadClipse反编译插件[转]

    jad是一个使用比较广泛的Java反编译软件,jadClipse是jad在eclipse下的插件,下面像大家介绍下如何将jadclipse加入到MyEclipse10.X,9.X,8.X,6.X等各版 ...