【jQuery滑动星星评分效果】教程文章相关的互联网学习教程文章

基于jquery插件制作左右按钮与标题文字图片切换效果_jquery【图】

本例用了2个js文件jquery-ui-1.8.6.core.widget.js和jqueryui.bannerize.js,到演示页面可以查看 CSS Code 代码如下: *{margin:0;padding:0;list-style-type:none;} a,img{border:0;} /* ui-banner */ .ui-banner{display:block;position:relative;width:820px;margin:20px auto;} .ui-banner.ui-banner-invalid{display:none;} .ui-banner,.ui-banner .ui-banner-slides,.ui-banner .ui-banner-slogans,.ui-banner .ui-banner-ar...

jquery给图片添加鼠标经过时的边框效果_jquery【图】

一哥们儿要给图片添加鼠标经过时的边框效果,可惜出发点错了,直接加在了IMG外的A标签上致使 鼠标经过时图片产生塌陷,实则应该将边框控制直接加在IMG标签上即可 错误代码如下:注意红色部分设置 (出发点就错了) 代码如下: $(document).ready(function(){ $("#box a").mouseover(function(){ $(this).css("border","1px solid red"); }); $("#box a").mouseout(function(){ $(this).css("border","none"); }); }); #box a...

基于jquery实现的文字淡入淡出效果_jquery【图】

代码如下: 无标题文档 $(document).ready(function(){ $("#btn1").toggle(function(){ $("p").fadeOut("slow"); },function(){ $("p").fadeIn("slow"); }); $("#btn2").toggle(function(){ $("p").fadeTo("slow",0.66); },function(){ $("p").fadeTo("slow",0.66); }); }); ...

jquery放大镜效果超漂亮噢_jquery【图】

这个放大镜的代码挺简单滴效果也不错。 代码如下: //QQ:496928838 微凉 $(function(){ $("#demo").enlarge( { // 鼠标遮罩层样式 shadecolor: "#FFD24D", shadeborder: "#FF8000", shadeopacity: 0.4, cursor: "move", // 大图外层样式 layerwidth: 480, layerheight: 360, layerborder: "#DDD", fade: true, // 大图尺寸 largewidth: 960, largeheight: 720 }); }); 代码如下: /* Enlarge for jQuery v1.0 Abel Yao, 20...

jQuery实现点击文本框弹出热门标签的提示效果_jquery【图】

代码如下: jQuery实现点击文本框弹出热门标签的提示示例_网页代码站 body { font-size:12px;font-family:Arial; } #m_tagsItem { background:#fff; position:absolute; top:0px; left:0px; overflow:hidden; width:590px; *width:561px; width:561px\9; padding:10px; border:1px solid #ccc; z-index:1000; display:none; } #m_tagsItem p { text-align:left; line-height:22px; padding:2px 0; margin:0; border:0; } #m_tag...

jquery实现手风琴效果实例代码_jquery【图】

代码如下://jquery实现手风琴效果 手风琴 $(function(){ $("#accordion").accordion( { header: "h3", event:"mouseover", icons:{ header:"ui-icon-carat-2-e-w" }, } ).sortable({ axis:"Y"//拖动效果 上下拖动 默认为左右拖动 }); }) first Lorem ipsum dolor sit ...

jquery实现图片灯箱明暗的遮罩效果_jquery【图】

效果如下:DIV结构: jquery实现:调用:

用jquery中插件dialog实现弹框效果实例代码_jquery【图】

代码如下: 弹框遮罩效果 #dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;} #dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;} $(function(){ $("#dialog").dialog({ autoOpen:false, buttons:[{ text:"ok", click:function(){ $("#dialog").dialog("close...

动态标签悬停效果延迟加载示例代码_jquery

----------------------对于动态的标签绑定事件------------------------ 代码如下: var outTimer;//执行时间 var upTimer;//执行时间 var sqDiv = $("#tm");//要显示的div var test="";//标识,为了将鼠标移到显示的div上时,div不会消失 var dd = "";//划过某一字段传的值 function test1(){ $("#tm").empty();//现将div清空 $.ajax({ //往里加数据 type:"post", url:"/webmodule/constructionDecision/BaseCD/getCommunityInfo...

jquery实现图片滚动效果的简单实例_jquery【图】

代码如下: jquery 图片自动无缝滚动 ul,li { list-style: none;margin: 0; padding: 0;} li { float: left;} img { width: 100px; height: 100px; padding:0 2px} .a { width: 400px; height:100px;margin: 0 auto; overflow: hidden; border: 1px solid red;} .aa { width: 200px; height:100px;margin: 50px auto 0 auto; overflow: hidden; border: 1px solid re...

jquery实现弹出窗口效果的实例代码_jquery

JavaScript实现弹出窗口实质上就是在浏览器上画了一个方形区域,并在开始时将其隐藏,只是到某个JavaScript事件时才通过修改css的属性值来将其显示出来。 其大致步骤为: ?创建一个装载弹出窗口的div 代码如下: jQuery实例1:浮动窗口 弹出窗口 我是标题栏!X 我是一个窗口! 创建相应的css文件将其显示为一个弹出窗口 代码如下:#win{ /*边框*/ border:1px red solid; ...

juery框架写的弹窗效果适合新手_jquery【图】

本人新手写点代码有点村,希望大家多多包含!!!!!! 代码如下: js弹窗效果 //document.body.offsetWidth="512px"; function mina(){ $("#dv").css("display","block"); var a = $(document).height(); var b = $(window).width(); var h =$(window).height(); f = (b-300)/2; d =(h-300)/2; $("#dv").css("margin-top",d); $("#dv").css("margin-left",f); $("#zhezhao").toggle(); $("#zhezhao").css("width",b); $("#...

jquery导航制件jquery鼠标经过变色效果示例_jquery【图】

代码如下:鼠标移到导航上面 当前的LI变色 处于当前的位置ul,li{list-style:none;}#nav li{display:inline-block;margin:0 5px;background:#ccc;padding:0 10px; line-height:24px;font-size:12px;float:left;}#nav li.h_nav_over{background:red;color:#fff;}#nav li.h_nav_over a{color:#fff;}a{text-decoration:none;}$(function(){$("#nav>ul>li").mouseover(function(){ $("#nav>ul>li").each(function(i){ ...

jquery插件tooltipv顶部淡入淡出效果使用示例_jquery【图】

内部使用 代码如下: info alert hide $("#tooltipContainer").tooltip(); //初始化 function tg1() { $("#tooltipContainer").tooltip("info", "据你的使用和需求的不同..."); } function tg2() { $("#tooltipContainer").tooltip("alert", "据你的使用和需求的不同..."); } function tg3() { $("#tooltipContainer").tooltip(...

jquerydiv拖动效果示例代码_jquery【图】

代码如下: pageEncoding="utf-8"%> 拖动DIV .show{ background:#7cd2f8; width:100px; height:100px; text-align:center; position:absolute; z-index:1; left:100px; top:100px; } $(document).ready(function() { $(".show").mousedown(function(e)//e鼠标事件 { $(this).css("cursor","move");//改变鼠标指针的形状 var offset = $(this).offset();//DIV在页面的位置 var x = e.pageX - offset.left;//获得鼠标指针离DIV...