那天在网上找js的提示小框框,突然发现下面这个程序(写的很不错)





idche , ljtips http://www.cnblogs.com/idche/







请划过或点击下面带框的文本

看我这里一个DIV


提示在我的下面出现
提示在左边出现
提示出现2秒后会自动消失
提示可以有关闭按钮
不同担心页面放大缩小会位置会偏移哦

优点

  • 1:兼容 各种浏览器
  • 2:自己定义TIPS样式(颜色),CSS3渐进增强
  • 3:多方向弹出提示
  • 4:纯CSS+javascript(不包含任何图片)
  • 5:体积超级小 CSS+js = 3k

参数配置

  • ljtips(object).show(JSON)
  • object: DOM对象ID(test1), DOM对象
  • json:{
    content:提示的消息内容(必须),
    p:提示框位置(可选值top left bottom right),默认为right(可选),
    closeBtn:是否有关闭按钮(true false) 默认值(false)(可选),
    time:多少毫秒提示框消失(可选)
    }
    

使用说明

  • 主要方法 .show(); .hide();.clear(); 一般你只需要使用show,hide;
  • 使用1
  • 首先实例化一个ljtips(var tips=ljtips('test1')); 然后使用tips.show(JSON)
  • 使用2
  • 在行内调用提示框“
  • 使用3
  • 在JS里调用document.getElementById("test6").onmouseover = function(){ljtips(this).show({content:"这个框你关不掉了吧!没有关闭按钮!",p:'right'})};


你可能感兴趣的:(编程相关,Web前端)