大家好,欢迎来到IT知识分享网。
目的
浏览器自带的title属性无法很好的作为提示语,故使用
js重写tilte
样例
代码
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<style>
/*修改提示框*/
#mytitle {
position: absolute;
color: #333333;
max-width: 300px;
font-size: 12px;
padding: 4px;
font-weight: bolder;
background-color: #fff5d8;
border: 1px solid #e0a385;
padding:6px 12px 4px 12px;
}
</style>
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<script>
$(function(){
setTitle($('input[name="test"]'),'这是一个自定义标题');
})
function setTitle(dom,title){
var x = 10;
var y = 30;
dom.mouseover(function (e) {
newtitle = this.title;
this.title = '';
$('body').append('<div id="mytitle" >' + title + '</div>');
$('#mytitle').css({
'left': (e.pageX + x + 'px'),
'top': (e.pageY + y - 80 + 'px')
}).show();
}).mouseout(function () {
this.title = newtitle;
$('#mytitle').remove();
})
$("input").focus(function(){
$('#mytitle').remove();
});
}
</script>
</head>
<body>
<div style="margin-top: 200px;text-align: center;">
<input type='text' name='test' />
</div>
</body>
</html>
免责声明:本站所有文章内容,图片,视频等均是来源于用户投稿和互联网及文摘转载整编而成,不代表本站观点,不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益,请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权,请联系删除,如若转载,请注明出处:https://yundeesoft.com/29113.html