<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
window.onload = function (){
var oUl = document.getElementById("list");
var aLi = oUl.getElementsByTagName("li");
var half = 2;
var off = 1; for(var i = 0; i < aLi.length; i++)
{
aLi[i].index = i;
aLi[i].onmouseover = function (){
if(off)
{
fillstar(this.index,half);
} } aLi[i].onmouseout = function (){ if(off)
{
for(var i = 0; i < aLi.length; i++ )
{
aLi[i].style.background = "url(http://img.alicdn.com/tps/i1/T1r.UsXf4dXXcC1lsa-204-400.png) no-repeat";
}
} } aLi[i].onclick = function (){
if(off)
{
fillstar(this.index,half);
off = !off;
} } function fillstar(num,half){ if( num < half )
{
for(var i = 0; i <= num; i++)
{
aLi[i].style.background = "url(http://img.alicdn.com/tps/i1/T1r.UsXf4dXXcC1lsa-204-400.png) no-repeat 0px -116px";
} }else if ( num >= half && num < aLi.length - 1 ){ for(var i = 0; i <= num; i++)
{
aLi[i].style.background = "url(http://img.alicdn.com/tps/i1/T1r.UsXf4dXXcC1lsa-204-400.png) no-repeat 0px -57px";
}
}else { for(var i = 0; i <= num; i++)
{
aLi[i].style.background = "url(http://img.alicdn.com/tps/i1/T1r.UsXf4dXXcC1lsa-204-400.png) no-repeat 0px -87px";
}
}
}
} }
</script>
<style>
#list{list-style: none;}
#list li{
height: 23px;
width: 24px;
background: url(http://img.alicdn.com/tps/i1/T1r.UsXf4dXXcC1lsa-204-400.png) no-repeat;
display: block;
float: left;
cursor: pointer; }
</style>
</head>
<body>
<ul id = "list">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</body>
</head>

js 淘宝评分的更多相关文章

  1. Auto.js淘宝领喵币

    最近,淘宝的新玩法,一直在充斥我的眼球,尤其是喵币的,盖楼... .... 于是就进去看了看,发现逛逛店铺,给好多喵币,但是要进20个,每个要15秒,好麻烦,于是就上网搜了一下,有没有脚本 因为之前搞 ...

  2. JS淘宝小广告

    <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8 ...

  3. JS淘宝浏览商品

    <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8 ...

  4. 淘宝首页源码藏美女彩蛋(下)(UED新作2013egg)

    我们已经知道,执行美女会得到"彩蛋",而正是彩蛋做到了taobaoUED展现给大家的神奇的前端魅力.今天我们来看看FP.egg&&FP.egg("%cjo ...

  5. JS五星级评分效果(类似与淘宝打分效果)

    今天晚上研究下 五星级评分效果,类似于淘宝后台评分效果,如下图所示: 思路: 当鼠标移到一颗星的时候 判断当前的索引 当前及当前的索引前面的星星亮起来 每当移到任何一颗星星时候 下面跟随提示 mous ...

  6. 仿淘宝分页按钮效果简单美观易使用的JS分页控件

    分页按钮思想:  1.少于9页,全部显示  2.大于9页,1.2页显示,中间页码当前页为中心,前后各留两个页码  附件中有完整例子的压缩包下载.已更新到最新版本  先看效果图:  01输入框焦点效果  ...

  7. 摘自淘宝的js地区组件

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

  8. 手把手教你写电商爬虫-第四课 淘宝网商品爬虫自动JS渲染

    版权声明:本文为博主原创文章,未经博主允许不得转载. 系列教程: 手把手教你写电商爬虫-第一课 找个软柿子捏捏 手把手教你写电商爬虫-第二课 实战尚妆网分页商品采集爬虫 手把手教你写电商爬虫-第三课 ...

  9. JS仿淘宝详情页菜单条智能定位效果

    类似于淘宝详情页菜单条智能定位 对于每个人来说并不陌生!如下截图所示:红色框的那部分! 基本原理: 是用JS侦听滚动事件,当页面的滚动距离(页面滚动的高度)大于或者等于 "对象"( ...

随机推荐

  1. IIS是怎么处理同时到来的多个请求的?

        假设有一台服务器,它的IIS上部署有一个Web应用程序-S,可以通过浏览器或其他方式进行访问.     假设有A.B.C三台电脑同时访问网站S,IIS接收到3个HTTP请求,然后分别为三个请求 ...

  2. 简单Dp----最长公共子序列,DAG最长路,简单区间DP等

    /* uva 111 * 题意: * 顺序有变化的最长公共子序列: * 模板: */ #include<iostream> #include<cstdio> #include& ...

  3. chrome浏览器无法安装非应用商店插件的解决办法

    不久前,安装了一个非chrome应用商店的第三方应用,今天突然发现无法使用,打开chrome的扩展程序后,发现该插件以及被禁用,在网上查找了解决方法,设置“开发者模式”,修改了chrome的参数,仍然 ...

  4. POJ1848 Tree 【树形dp】

    题目链接 POJ1848 题解 由题,一个环至少由三个点组成,一个点作为根时,可以单独成链,可以与其一个儿子成链,或者与其两个儿子成环,与其一个剩余链长度大于等于2的儿子成环. 那么我们设最小代价 \ ...

  5. BZOJ5302 [HAOI2018]奇怪的背包 【数论 + dp】

    题目 小 CC 非常擅长背包问题,他有一个奇怪的背包,这个背包有一个参数 PP ,当他 向这个背包内放入若干个物品后,背包的重量是物品总体积对 PP 取模后的结果. 现在小 CC 有 nn 种体积不同 ...

  6. 无序字母对 character

    无序字母对 character 题目描述 给定n个各不相同的无序字母对(区分大小写,无序即字母对中的两个字母可以位置颠倒).请构造一个有n+1个字母的字符串使得每个字母对都在这个字符串中出现. 输入 ...

  7. PowerDesigner反向生成数据库模型(MySql篇)

    目录: 数据库的反向生成模型 模型的Cooment注释显示 步骤一:下载odbc驱动并进行安装: (1)下载 mysql-connector-odbc-5.3.4-win32 注意:不管电脑是32位, ...

  8. BZOJ 1497: [NOI2006]最大获利

    1497: [NOI2006]最大获利 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 4572  Solved: 2239[Submit][Status] ...

  9. Python 函数的一般形式及参数

    #!/usr/bin/env python # -*- coding:utf-8 -*- # @Time : 2017/11/01 21:46 # @Author : lijunjiang # @Fi ...

  10. 【转载】Word2010编号列表&多级列表

    1.引用场景         对于一份标准.漂亮的word文档,编号列表和多级列表的设置时必不可少的,正因为有它们,文档看起来才更专业,使用起来才更加的方便.如下面截图一般,这是十分常见的多级列表设置 ...