注册 | 登陆

您的位置：阿里西西 > 网页特效 > 实例特效 > 详细内容

3顶

点亮星星进行投票的精典网页特效

稿源：互联网 2022-06-10 18:01:24 点击： 1551 撤稿纠错

投票特效，购物网用户评价、论坛用户投票等等，很多地方都用得到

以下讨论的是和特效网页网页特效星星投票相关的点亮星星进行投票的精典网页特效教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<script language="javascript"><br>/*<br>   Class that defines a standard ratings component.<br>*/<br>// Messages for display above the individual ratings units. The length of the<br>// array also defines how many units to include in the component.<br>yg_Ratings.Msgs = new Array<br>(<br>   "差",<br>   "及格",<br>   "一般",<br>   "比较好",<br>   "棒极了"<br>);<br>yg_Ratings.Labels = new Array<br>(<br>   "1 Star",<br>   "2 Stars",<br>   "3 Stars",<br>   "4 Stars",<br>   "5 Stars"<br>);<br>// Path for all images.<br>//var path = "http://us.i1.yimg.com/us.yimg.com/i/us/ls/gr/";<br>//var path = "http://us.i1.yimg.com/us.yimg.com/i/us/sh/karma/yri_";<br>var path = "http://www.dphost.cn/images/yri_";<br>yg_Ratings.starbar = "star_";<br>// Image for set units.<br>yg_Ratings.UnitY = "yellow.gif";<br>// Image for set units <= the mouse over point.<br>yg_Ratings.UnitYMouseOver = "yellow.gif";<br>// Image for set units > the mouse over point.<br>yg_Ratings.UnitYMouseLess = "grey.gif";<br>// Image for unset units.<br>yg_Ratings.UnitN = "white.gif";<br>// Image for unset units <= the mouse over point.<br>yg_Ratings.UnitNMouseOver = "hover.gif";<br>yg_Ratings.DefaultMsg = "&nbsp;";<br>function yg_Ratings(id, button, inputname, defaultval,type)<br>{<br>   // The id parameter is the name (a string) of the variable to which the<br>   // instance is assigned. (The variable is sent along to event handlers,<br>   // so it must be in the global scope.)<br>   var i, t;<br>   var attributes;<br>   var h1, h2;<br>   var d = document;<br>   var style;   <br>   this.starbar = type + "_";<br>   this.rating = 0;<br>   this.showbutton = button;<br>   if (defaultval < 1 || defaultval > 5) {<br> defaultval = 0;<br>   }<br>   this.rating = defaultval;<br>  <br>   attributes = 'class="ygrtngs" id="' + id + '" style="' + style + '"';<br>   h1 = 'onMouseOut="return yg_Ratings_mouseOut(' + id + ');"';<br>   d.write('<span ' + attributes + ' ' + h1 + '>');<br>   if (defaultval > 0 && type == "star") {<br>       d.write('<div class="msg" id="'+id+'_msg">'+yg_Ratings.Msgs[defaultval-1]+'</div>');<br>   } else {<br>       d.write('<div class="msg" id="'+id+'_msg" style="display:none">'+yg_Ratings.DefaultMsg+'</div>');<br>   }<br>   if (this.showbutton) { <br>      d.write('<span><strong>Rate it:</strong></span>');<br>   }<br>   for (i = 1; i <= yg_Ratings.Msgs.length; i++)<br>   {<br>      h1 = 'onMouseOver="return yg_Ratings_mouseOver(' + id + ', ' + i + ');"';<br>      h2 = 'onClick="return yg_Ratings_click(' + id + ', ' + i + ');"';<br>      d.write('<span class="unit "' + h1 + ' ' + h2 + '>');<br>      if (i <= defaultval) {<br>         d.write('<img src="' + path + this.starbar + yg_Ratings.UnitY + '" />');<br>      } else {<br>         d.write('<img src="' + path + this.starbar + yg_Ratings.UnitN + '" />');<br>      }<br>      d.write('</span>');<br>   }<br>   if(defaultval){<br> d.write('<input type="hidden" name="'+inputname+'" id="input_'+id+'" value="' + defaultval + '" />');<br>   } else {<br> d.write('<input type="hidden" name="'+inputname+'" id="input_'+id+'" />');    <br>   }<br>   this.input = document.getElementById('input_'+id);<br>   d.write('</span>');<br> <br>   this.parent = document.getElementById(id);<br>   this.images = this.parent.getElementsByTagName("img");<br>   this.msg = document.getElementById(id + '_msg');<br>   this.id = id;<br>   var children = this.msg.childNodes;<br>   var node;<br>   for (var i = 0; i <  children.length; i++)<br>   {<br>      node = children[i];<br>      if (node.nodeType == 3)<br>      {<br>            this.DefaultMsg = node.nodeValue;<br>      }<br>   } <br>}<br>function yg_Ratings_set(n, oflag)<br>{<br>   if (arguments.length < 2)<br>      oflag = true;<br>   <br>   this.rating = n;<br>   this.DefaultMsg = yg_Ratings.Msgs[n-1];<br>//   if (this.showbutton) {<br>    this.showBtn("btnSave");<br>//   }<br>   this.update(n, oflag);<br>}<br>function yls_Ratings_showSubmit(sBtn) {<br>    var saveButton = document.getElementById(sBtn);<br>    if(saveButton != null) {<br>        saveButton.style.display="block";<br>    }<br>}<br>function yg_Ratings_setMsg(m)<br>{<br>   var children = this.msg.childNodes;<br>   var node;<br>   for (var i = 0; i < children.length; i++)<br>   {<br>      node = children[i];<br>      if (node.nodeType == 3)<br>      {<br>         // Using 0xA0 prevents the browser from collapsing empty messages.<br>            node.nodeValue = m;<br>      }<br>   }<br>}<br>function yg_Ratings_get()<br>{<br>   return this.rating;<br>}<br>function yg_Ratings_update(n, oflag)<br>{<br>   // The oflag parameter is true when the mouse is outside of the ratings<br>   // component. The n parameter is the <br>   if (this.starbar == 'star_') {<br>    if (oflag) {<br>    this.setMsg(this.DefaultMsg);<br>    } else {<br>    this.setMsg(yg_Ratings.Msgs[n - 1]);<br>    }<br>   }<br>   if (n == this.rating) {<br>      this.input.setAttribute("value", n);<br>   }<br>   for (i = 1; i <= yg_Ratings.Msgs.length; i++)<br>   {<br>      if (oflag)<br>      {<br>         if (i <= this.rating)<br>            this.images[i - 1].src = path + this.starbar + yg_Ratings.UnitY;<br>         else<br>            this.images[i - 1].src = path + this.starbar + yg_Ratings.UnitN;<br>      }<br>      else<br>      {<br>         if (i <= n)<br>         {<br>            if (i <= this.rating)<br>               this.images[i - 1].src = path + this.starbar + yg_Ratings.UnitYMouseOver;<br>            else<br>               this.images[i - 1].src = path + this.starbar + yg_Ratings.UnitNMouseOver;<br>         }<br>         else<br>         {<br>            if (i <= this.rating)<br>               this.images[i - 1].src = path + this.starbar + yg_Ratings.UnitYMouseLess;<br>            else<br>               this.images[i - 1].src = path + this.starbar + yg_Ratings.UnitN;<br>         }<br>      }<br>   }<br>   return true;<br>}<br>function yg_Ratings_click(obj, n)<br>{<br>   obj.set(n, false);<br>   return true;<br>}<br>function yg_Ratings_mouseOver(obj, n)<br>{<br>   obj.update(n, false);<br>   return true;<br>}<br>function yg_Ratings_mouseOut(obj)<br>{<br>   obj.update(0, true);<br>   return true;<br>}<br>yg_Ratings.prototype.set = yg_Ratings_set;<br>yg_Ratings.prototype.setMsg = yg_Ratings_setMsg;<br>yg_Ratings.prototype.get = yg_Ratings_get;<br>yg_Ratings.prototype.update = yg_Ratings_update;<br>yg_Ratings.prototype.showBtn = yls_Ratings_showSubmit;<br></script><br>访问速度：<br><script><br>   <br>   if (document.getElementById)<br>    {<br>    // Support for Class A.<br>    _ratings_proj1_ = new yg_Ratings("_ratings_proj1_", false, "proj1", 0, "star");<br>    }<br>   else<br>    {<br>    // Support for poor DOM (low grade).    <br>    document.write('<small><input type=radio name="proj1" value="1">');<br>    document.write('<input type=radio name="proj1" value="2">');<br>    document.write('<input type=radio name="proj1" value="3">');<br>    document.write('<input type=radio name="proj1" value="4">');<br>    document.write('<input type=radio name="proj1" value="5"></small>');<br>    }<br>   <br>   </script><br>   <noscript><small><br>   <input type=radio name="proj1" value="1"><br>   <input type=radio name="proj1" value="2"><br>   <input type=radio name="proj1" value="3"><br>   <input type=radio name="proj1" value="4"><br>   <input type=radio name="proj1" value="5"></small></noscript><br>   性价比：<br>   <script><br>   <br>   if (document.getElementById)<br>    {<br>    // Support for Class A.<br>    _ratings_proj2_ = new yg_Ratings("_ratings_proj2_", false, "proj2", 0, "star");<br>    }<br>   else<br>    {<br>    // Support for poor DOM (low grade).    <br>    document.write('<small><input type=radio name="proj2" value="1">');<br>    document.write('<input type=radio name="proj2" value="2">');<br>    document.write('<input type=radio name="proj2" value="3">');<br>    document.write('<input type=radio name="proj2" value="4">');<br>    document.write('<input type=radio name="proj2" value="5"></small>');<br>    }<br>   <br>   </script><br>   <noscript><small><br>   <input type=radio name="proj2" value="1"><br>   <input type=radio name="proj2" value="2"><br>   <input type=radio name="proj2" value="3"><br>   <input type=radio name="proj2" value="4"><br>   <input type=radio name="proj2" value="5"></small></noscript><br>   </td></tr><tr><td><br>   服务质量：</td><td><br>   <script><br>   <br>   if (document.getElementById)<br>    {<br>    // Support for Class A.<br>    _ratings_proj3_ = new yg_Ratings("_ratings_proj3_", false, "proj3", 0, "star");<br>    }<br>   else<br>    {<br>    // Support for poor DOM (low grade).    <br>    document.write('<small><input type=radio name="proj3" value="1">');<br>    document.write('<input type=radio name="proj3" value="2">');<br>    document.write('<input type=radio name="proj3" value="3">');<br>    document.write('<input type=radio name="proj3" value="4">');<br>    document.write('<input type=radio name="proj3" value="5"></small>');<br>    }<br>   <br>   </script><br>   <noscript><small><br>   <input type=radio name="proj3" value="1"><br>   <input type=radio name="proj3" value="2"><br>   <input type=radio name="proj3" value="3"><br>   <input type=radio name="proj3" value="4"><br>   <input type=radio name="proj3" value="5"></small></noscript><br>   </td><td><br>   安全性：</td><td><br>   <script><br>   <br>   if (document.getElementById)<br>    {<br>    // Support for Class A.<br>    _ratings_proj4_ = new yg_Ratings("_ratings_proj4_", false, "proj4", 0, "star");<br>    }<br>   else<br>    {<br>    // Support for poor DOM (low grade).    <br>    document.write('<small><input type=radio name="proj4" value="1">');<br>    document.write('<input type=radio name="proj4" value="2">');<br>    document.write('<input type=radio name="proj4" value="3">');<br>    document.write('<input type=radio name="proj4" value="4">');<br>    document.write('<input type=radio name="proj4" value="5"></small>');<br>    }<br>   <br>   </script><br>   <noscript><small><br>   <input type=radio name="proj4" value="1"><br>   <input type=radio name="proj4" value="2"><br>   <input type=radio name="proj4" value="3"><br>   <input type=radio name="proj4" value="4"><br>   <input type=radio name="proj4" value="5"></small></noscript></font><br><a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>

关于点亮星星进行投票的精典网页特效的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/200904283949.shtml方便下次再访问哦。

·上一篇： 可转动的3D立体矩阵特效
·下一篇： 通用兼容多种浏览器的加入收藏夹代码特效

相关阅读

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

最新游戏

更多 »

最新新闻

更多 »