资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

jquery鼠标提示,jquery设置鼠标样式

Jquery怎样实现文本输入框鼠标定位时弹出提示

下面是html实现鼠标悬停时显示提示信息:

创新互联主要从事网站设计制作、网站制作、网页设计、企业做网站、公司建网站等业务。立足成都服务蒲县,10多年网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:13518219792

input type="text" title="日期格式为:yyyy/MM或yyyy/MM/dd" /

jquery实现:

$(input).addAttr('title','日期格式为:yyyy/MM或yyyy/MM/dd');

input type="text" /

jquery 怎么实现鼠标在DIV上停止不动3秒后就出现悬浮提示框,如果移动鼠标的话就立刻关掉提示框

先说不用js的方法

给div添加一个title属性即可(但是这样是没法操作到提示框的样式的 所以有js方法)

js方法 下面给出一份演示

!DOCTYPE HTML

html

head

title演示/title

script src=""/script

style type="text/css"

.TitleDiv{

width:300px;

background-color: #dddddd;

color: white;

padding: 15px 0;

}

.TitleDivText{

background-color: rgba(0,0,0,0.5);

color: white;

}

/style

/head

body

div class="TitleDiv"

我是一个需要提示的div

/div

div class="TitleDiv"

我是一个需要提示的div

/div

div class="TitleDiv"

我是一个需要提示的div

/div

script type="text/javascript"

//四个参数 

//Element表示需要提示的节点或者jq对象 可以是多个

//Text提示的文本

//Time 鼠标移入等待多少的时间才显示 单位毫秒

//Class 提示框的class属性可以修改样式

function MoveTitle(Element,Text,Time,Class){

var ElementJQ=$(Element);

//创建提示框

var CreateTitle=function(event){

if(ElementJQ.TitleTime){

clearTimeout(ElementJQ.TitleTime);

ElementJQ.TitleTime=setTimeout(function(){

ElementJQ.TitleDiv=document.createElement("div");

if(Class){

$(ElementJQ.TitleDiv).addClass(Class);

}

$(ElementJQ.TitleDiv).css({

position:"fixed",

left:event.clientX+16+"px",//16是鼠标的宽度

top:event.clientY+16+"px",//16是鼠标的高度

});

$(ElementJQ.TitleDiv).html(Text);

document.body.appendChild(ElementJQ.TitleDiv);

},Time)

}else{

ElementJQ.TitleTime=setTimeout(function(){

ElementJQ.TitleDiv=document.createElement("div");

if(Class){

$(ElementJQ.TitleDiv).addClass(Class);

}

$(ElementJQ.TitleDiv).css({

position:"fixed",

left:event.clientX+16+"px",//16是鼠标的宽度

top:event.clientY+16+"px",//16是鼠标的宽度

});

$(ElementJQ.TitleDiv).html(Text);

document.body.appendChild(ElementJQ.TitleDiv);

},Time)

}

}

ElementJQ.on("mousemove",function(e){

clearTimeout(ElementJQ.TitleTime);

ElementJQ.TitleTime=null;

if(ElementJQ.TitleDiv){

document.body.removeChild(ElementJQ.TitleDiv);

ElementJQ.TitleDiv=null;

}

CreateTitle(e);

});

ElementJQ.on("mouseover",function(e){

CreateTitle(e);

});

ElementJQ.on("mouseout",function(){

clearTimeout(ElementJQ.TitleTime);

ElementJQ.TitleTime=null;

if(ElementJQ.TitleDiv){

document.body.removeChild(ElementJQ.TitleDiv);

ElementJQ.TitleDiv=null;

}

});

}

var div=$(".TitleDiv")

MoveTitle(div,"我是提示的内容",3000,"TitleDivText");

/script

/body

/html

jquery 做一个 鼠标移动table上的tr的时候,在鼠标旁边弹出一个div提示框

先定义一个DIV,把你要提示的内容,放到这个DIV中

div id="divInfo" style="visibility:hidden;"

p向上增加一行/pbr/

p修改此行/pbr/

p向下增加一行/p

/div

代码:

$("table tr").mouseover(function(){

$("#divInfo").css("z-index",999);//让层浮动

$("#divInfo").css("top",this.top+行高);//设置提示div的位置

$("#divInfo").css("left",11);

$("#divInfo").css("visibility","visible");

})

就行了

Jquery中怎么实现鼠标移动到某处时出现一个弹窗,里头还有链接的效果

这位网友你好,这个白色的窗口其实在鼠标移上去之前是隐藏的,加了display:none属性,当鼠标放上去后再显示而已,display:block;,很简单的。

jq 求Jquery实现鼠标移上弹出提示框,移出消失(实现的再追加50分,一共150分)

如果你用JQUERY UI的话会很简单的

先把 “script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"/script” 加上

然后在“欢迎提意见”那个a里加上一个属性“title”,也就是 a id="tiyijian" href="#" title="文字提示内容"欢迎提意见/a

最后在mouseover的function里加上

$(this).tooltip({

position: {

my: "left top",        

at: "right+5 top-5"

}

});

position 可自行做调整,css也可以添加,详细看jquery-ui tooltip


文章标题:jquery鼠标提示,jquery设置鼠标样式
网站网址:http://cdkjz.cn/article/dsehpep.html
多年建站经验

多一份参考,总有益处

联系快上网,免费获得专属《策划方案》及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

大客户专线   成都:13518219792   座机:028-86922220