tips.js提示框插件


<!DOCTYPEhtml> <html>     <head>         <title>demo</title>         <metacharset="UTF-8">         <scripttype="text/javascript"src="js/jquery.js"></script>         <scripttype="text/javascript"src="js/jquery.tips.js"></script>         <style>         #myinput{position:relative;top:200px;left:200px;}         </style>         <scripttype="text/javascript">             $(function (){                 $('#myinput').click(function(){                     $(this).tips({                         side:1,  //1,2,3,4 分別代表 上右下左                         msg:'上方彈出消息,3秒后自動消失,鼠標懸浮時,自動延時',//tips的文本內容                         color:'#FFF',//文字顏色,默認為白色                         bg:'#FD9720',//背景色,默認為紅色                         time:3,//默認為2 自動關閉時間 單位為秒 0為不關閉 (點擊提示也可以關閉)                         x:0,// 默認為0 橫向偏移 正數向右偏移 負數向左偏移                         y:0 // 默認為0 縱向偏移 正數向下偏移 負數向上偏移                     }).tips({                         side:2,                         msg:'右方彈出消息,5秒后自動消失,鼠標懸浮時,自動延時',                         bg:'#AE81FF',                         time:5                     }).tips({                         side:3,                         msg:'下方彈出消息,7秒后自動消失,鼠標懸浮時,自動延時',                         bg:'#307FC1',                         time:7                     }).tips({                         side:4,                         msg:'左方彈出消息,不自動消失,鼠標點擊才會消失',                         time:0                     });                 });             });           </script>     </head>     <body>         <inputid="myinput"/>     </body> </html>

注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
粤ICP备14056181号  © 2014-2021 ITdaan.com