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( ...
随机推荐
- php curl-class post
use \Curl\Curl; $curl = new Curl();$curl->setHeader('Content-Type', 'application/json');$curl-> ...
- vue使用sass
一.安装sass依赖包 $ npm install sass-loader --save-dev //sass-loader依赖于node-sass $ npm install node-sass - ...
- nagios监控报错 It appears as though you do not have permission to view...
今天在安装完nagios后,通过nagios网页界面点击主机.服务.问题页面时.均报错,报错的内容都差不多.如点击服务,报错: It appears as though you do not have ...
- 使用iLO远程管理HP系列服务器
iLO是Integrated Ligths-out的简称,是HP服务器上集成的远程管理端口,它是一组芯片内部集成vxworks嵌入式操作系统,通过一个标准RJ45接口连接到工作环境的交换机.只要将服务 ...
- 【Android】Android import和export使用说明 及 export报错：jarlist.cache: Resource is out of sync with the file syst解决
在Android开发export项目时发现有时会报错,内容如下: Problems were encountered during export: Error exporting PalmIdent ...
- Html5游戏框架createJs组件--EaselJS(一)
现在html5小游戏越来越火爆了,由于公司业务的需要,也开发过几款微信小游戏,用canvas写的没有利用什么框架,发现性能一直不怎么好,所以楼主就只能硬着头皮去学习比较火的Adobe公司出的Creat ...
- intellij idea如何快速格式化代码
选中代码,一键格式化代碼: Ctrl+Alt+L
- 使用Wireshark分析QQ聊天
- vue--axios发送请求
首先安装:axios $ npm install axios $ cnpm install axios //taobao源 $ bower install axios 或者使用cdn: <scr ...
- GitHub 终端加速最佳实践
终端加速 GitHub 方法的前置条件, 一是购买了加速服务或者租用 VPS 搭建加速服务, 二是系统是 macOS, 三是终端是 iTerm, 四是 Shell 是 zsh. 终端加速 GitHub ...