js五星好评
一般我们在一些购物以及美食的网站都会看到五星好评之类的，一下是使用js制作的五星好评！
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Title</title>
- <style type="text/css">
- *{
- margin:0;
- padding:0;
- }
- div{
- width:135px;
- height: 30px;
- z-index: 1;
- opacity: .8;
- background: url("images/star.gif") repeat-x;
- position: relative;
- }
- .one{
- height: 30px;
- position: absolute;
- top:0;
- left:0;
- background:url('images/star.gif') repeat-x 0 -30px;
- }
- </style>
- <script>
- window.onload=function() {
- var div = document.getElementsByTagName("div")[0];
- var p = document.createElement("p");
- p.setAttribute("class","one");
- div.appendChild(p);
- div.onclick=function(ev)
- {
- var oEvent=ev||event;
- var wid = oEvent.offsetX;
- if(wid>=135){
- wid = 135;
- }
- p.style.width=wid+"px";
- }
- }
- </script>
- </head>
- <body>
- <div></div>
- </body>
- </html>
直接复制粘贴 即可查看效果图：
js五星好评的更多相关文章
- js五星好评2
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 如何用jQuery实现五星好评
jQuery是js的一个库,封装了我们开发过程中常用的一些功能,方便我们来调用,提高了我们的开发效率. Js库是把我们常用的功能放到一个单独的文件中,我们用的时候,直接引用到页面里面来就可以了. 接下 ...
- jQuery实现简单的五星好评
最近一直在认真的努力工作,今天工作完成得差不多了,比较轻松点,在工作中有遇到用jq实现五星好评功能,觉得简单又有用,所以空闲时间就想分享出来. css部分: <style> .u_star ...
- 亲，麻烦给个五星好评！—RatingBar
引言 上一篇的CheckBox已经让大家越来越接近实战演练了,本章我们继续分享干货给大家,今天介绍一个实用的UI控件RatingBar(星级评分条),对于使用过电商APP(某东,某宝等)的小伙伴们来说 ...
- python爬虫06 | 你的第一个爬虫，爬取当当网 Top 500 本五星好评书籍
来啦,老弟 我们已经知道怎么使用 Requests 进行各种请求骚操作 也知道了对服务器返回的数据如何使用 正则表达式 来过滤我们想要的内容 ... 那么接下来 我们就使用 requests 和 re ...
- UWP 五星好评
var pfn = Package.Current.Id.FamilyName; await Launcher.LaunchUriAsync(new Uri("ms-windows-stor ...
- JQ五星好评效果
$(".list-txt ul").find("li").click(function(){ if($(this).index()==0){ ...
- js五星评分
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...
- python爬虫06取当当网 Top 500 本五星好评书籍
主要思路 使用 page 变量来实现翻页 我们使用 requests 请求当当网 然后将返回的 HTML 进行正则解析 由于我们暂时还没学到数据库 所以解析完之后就把内容存到文件中 def main( ...
随机推荐
- Elasticsearch学习之ES节点类型以及各种节点的分工
ES各种节点的分工 1. 客户端节点 当主节点和数据节点配置都设置为false的时候,该节点只能处理路由请求,处理搜索,分发索引操作等,从本质上来说该客户节点表现为智能负载平衡器.独立的客户端节点在一 ...
- 【黑金原创教程】【FPGA那些事儿-驱动篇I 】实验十五：FIFO储存模块（同步）
实验十五:FIFO储存模块(同步) 笔者虽然在实验十四曾解释储存模块,而且也演示奇怪的家伙,但是实验十四只是一场游戏而已.至于实验十五,笔者会稍微严肃一点,手动建立有规格的储存模块,即同步FIFO.那 ...
- Logstash自带正则表达式
USERNAME [a-zA-Z0-._-]+ USER %{USERNAME} INT (?:[+-]?(?:[-]+)) BASE10NUM (?<![-.+-])(?>[+-]?(? ...
- Windows Server 2008 R2之六活动目录域服务的卸载
活动目录域服务的卸载是将DC降级为独立服务器或成员服务器的过程. 在删除活动目录之前,为了防止操作失败操作系统故障,须对系统进行备份.同时,我们还必须对待删除的域控制器进行如下检查 1.是否有操作主控 ...
- ftok函数
ftok函数 系统建立IPC通讯(消息队列.信号量和共享内存)时必须指定一个ID值.通常情况下,该id值通过ftok函数得到. ftok原型 头文件: #include <sys/types.h ...
- android 常见内存泄漏原因及解决办法
android常见内存泄漏主要有以下几类: 一.Handler 引起的内存泄漏. 在Android开发中,我们经常会使用Handler来控制主线程UI程序的界面变化,使用非常简单方便,但是稍不注意,很 ...
- 计蒜客 31447 - Fantastic Graph - [有源汇上下界可行流][2018ICPC沈阳网络预赛F题]
题目链接:https://nanti.jisuanke.com/t/31447 "Oh, There is a bipartite graph.""Make it Fan ...
- POJ 2253 - Frogger - [dijkstra求最短路]
Time Limit: 1000MS Memory Limit: 65536K Description Freddy Frog is sitting on a stone in the middle ...
- Linux下的反调试技术
Linux下的反调试技术 2014年01月30日 ⁄ 综合 ⁄ 共 2669字 ⁄ 字号 小 中 大 ⁄ 评论关闭 转自 http://wangcong.org/blog/archives/310 ...
- 洛谷P2679 子串 [noip2015] dp
正解:dp 解题报告: 感觉是道dp好题啊,所以就写了个题解 代码实现难度低,思维难度大,像我这种思维僵化傻逼选手只想到了爆搜+组合数学... 其实是道很妙的dp题!好趴也没有多妙主要大概是妙在想到了 ...