简要咨询咨询QQ网站导航网站搜索手机站点联系我们设为首页加入收藏 

jQuery基于图层模仿五星星评价功能的方法

来源:易贤网   阅读:1382 次  日期:2015-05-11 14:21:17

温馨提示:易贤网小编为您整理了“jQuery基于图层模仿五星星评价功能的方法”,方便广大网友查阅!

这篇文章主要介绍了jQuery基于图层模仿五星星评价功能的方法,使用jQuery动态修改元素背景色的方法实现星评功能,需要的朋友可以参考下

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"">

<html xmlns="">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script src="jquery-1.6.2.min.js" type="text/javascript"></script>

<script>

$(function(){

$(".star li").mouseenter(function(){

$(".star li").css("background","#f60");

$(this).css("background","#f60");

$(this).nextAll().css("background","#ccc");

})

});

</script>

<style type="text/css">

* {<br />

padding:0;margin:0;

list-style:none; float:left;

}

.star li {

float: left;

height: 20px;

width: 20px;

background-color: #CCC;

margin-right: 4px;

}

</style>

</head>

<body>

<div>选几星:</div>

<ul class="star">

<li></li>

<li></li>

<li></li>

<li></li>

<li></li>

</ul>

</body>

</html>

希望本文所述对大家的jQuery程序设计有所帮助。

更多信息请查看IT技术专栏

更多信息请查看脚本栏目
点此处就本文及相关问题在本站进行非正式的简要咨询(便捷快速)】     【点此处查询各地各类考试咨询QQ号码及交流群
上一篇:javasript实现密码的隐藏与显示
下一篇:jquery实现图片左右切换的方法
易贤网手机网站地址:jQuery基于图层模仿五星星评价功能的方法
由于各方面情况的不断调整与变化,易贤网提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!