ToolTip 通过Js实现代替超链接中的title效果

自定义Tooltip特效

body ul
{
list-style: none;
}
body li
{
margin: 60px;
}
div
{
border: 1px solid #CCC;
padding: 10px;
background: #dff5ff;
margin-left: 30px;
}

function initEvent() {
var links = document.getElementsByTagName("a");
for (var i = 0; i

  • 百度
  • 腾讯
  • 新浪
  • 搜狐

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

赞 (0)

相关推荐

  • 轻量级 JS ToolTip提示效果

    轻量级 JS ToolTip提示效果

    鼠标经过出现的提示效果,比title更漂亮,可订制.JS: 复制代码 代码如下: //---------------------------tooltip效果 start----------------------------------- //获取某个html元素的定位 function GetPos(obj){ var pos=new Object(); pos.x=obj.offsetLeft; pos.y=obj.offsetTop; while(obj=obj.offsetParent

  • jquery.cvtooltip.js 基于jquery的气泡提示插件

    序 1.插件名cvtooltip中的cv是ChinaValue的首字母缩写,而tooltip就是提示啦. 2.适用于新功能的提示,引导用户的提示,即时类消息的提示,操作失败提示(操作成功了也没人拦着)等等等,使用css实现,不附带任何图片文件. 3.目前发现的问题,在Chorme中表现的不给力,是由于Chrome对页面的解析与IE和FF不同,导致jquery的position或者offset返回值不同. 4.该插件依然是练习之作,一人之力,错误难免. 实例演示 1.载入页面的同时,气泡提示也显示

  • jQuery悬停文字提示框插件jquery.tooltipster.js用法示例【附demo源码下载】

    jQuery悬停文字提示框插件jquery.tooltipster.js用法示例【附demo源码下载】

    本文实例讲述了jQuery悬停文字提示框插件jquery.tooltipster.js用法.分享给大家供大家参考,具体如下: 运行效果截图如下: index.html页面: <!DOCTYPE html> <html lang="en"> <head> <title>jQuery Tooltips悬停文字提示框效果</title> <meta charset="utf-8" /> <lin

  • 使用JS组件实现带ToolTip验证框的实例代码

    使用JS组件实现带ToolTip验证框的实例代码

    本组件依赖JQuery 本人测试的JQuery 是1.8, 兼容IE8,IE9,谷歌,火狐等. //验证输入框 function ValidateCompent(input){ var _input = $(input).clone(true); _input.css("height",$(input).css("height")); _input.css("width", $(input).css("width")); va

  • 非常实用的js验证框架实现源码 附原理方法

    本文为大家分享一个很实用的js验证框架实现源码,供大家参考,具体内容如下 关键方法和原理: function check(thisInput) 方法中的 if (!eval(scriptCode)) { return false; } 调用示例: 复制代码 代码如下: <input type="text" class="text_field percentCheck" name="progress_payment_two" id="

  • js验证框架之RealyEasy验证详解

    使用Really_easy_field_validation_with_Prototype进行表单验证,具体内容如下 1.第一步当然是先引入js和css文件. <link href="${ ctx}/skin/css/validation.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="${ c

  • 手把手教你自己写一个js表单验证框架的方法

    在表单程序中,在页面上需要很多的Js代码来验证表单,每一个field是否必须填写,是否 只能是数字,是否需要ajax到远程验证,blablabla. 如果一个一个单独写势必非常的繁琐,所以我们的第一个目标就是构建一个类似DSL的东西, 用表述的语句而非控制语句来实现验证. 其次一个个单独写的话还有一个问题就是必须全部验证通过才能提交,但是单独验证会因为 这个特征而增加很多额外的控制代码,且经常会验证不全面.所以第二个目标就是能够全面 的整合整个验证的过程. 最后不能是一个无法扩展的一切写死的实现

  • ToolTip 通过Js实现代替超链接中的title效果

    自定义Tooltip特效 body ul { list-style: none; } body li { margin: 60px; } div { border: 1px solid #CCC; padding: 10px; background: #dff5ff; margin-left: 30px; } function initEvent() { var links = document.getElementsByTagName("a"); for (var i = 0; i

  • js删除指定位置超链接中含有百度与360的标题

    最近需要将最近更新的部分内容删除,只要标题中包括百度与360的都给删除了,这样用户就看不到了 function notxt(){ '删除指定位置超链接中含有百度与360的标题 var notext = ['百度','360']; $('#news ul li').each(function(){ var mytext = $(this).find('a').text(); for(var n=0; n<notext.length; n++) { if(mytext.indexOf(notext[

  • js基础之DOM中元素对象的属性方法详解

    js基础之DOM中元素对象的属性方法详解

    在 HTML DOM (文档对象模型)中,每个部分都是节点. 节点是DOM结构中最基本的组成单元,每一个HTML标签都是DOM结构的节点. 文档是一个    文档节点 . 所有的HTML元素都是    元素节点 所有 HTML 属性都是    属性节点 文本插入到 HTML 元素是    文本节点 注释是    注释节点. 最基本的节点类型是Node类型,其他所有类型都继承自Node,DOM操作往往是js中开销最大的部分,因而NodeList导致的问题最多.要注意:NodeList是'动态的',

  • js实现统计字符串中特定字符出现个数的方法

    本文实例讲述了js实现统计字符串中特定字符出现个数的方法.分享给大家供大家参考,具体如下: //js统计字符串中包含的特定字符个数 function getPlaceholderCount(strSource) { //统计字符串中包含{}或{xxXX}的个数 var thisCount = 0; strSource.replace(/\{[xX]+\}|\{\}/g, function (m, i) { //m为找到的{xx}元素.i为索引 thisCount++; }); return th

  • 解决vue.js在编写过程中出现空格不规范报错的问题

    解决vue.js在编写过程中出现空格不规范报错的问题

    找到build文件夹下面的webpack.base.conf.js文件. 然后打开该文件,找到图下这段代码,把他注释掉. 注释掉之后,再进行子页面等编写的时候,空格不规范的情况下也不会再报错啦.因为这个报错对于初学者来说实在头大.哈哈O(∩_∩)O哈哈~ 我标注的这些地方,原本是有严格的空格规范要求的,这些报错真是另人烦躁呀o(╥﹏╥)o 反正我把这个问题解决了,特别开心哒哒哒~~~ 以上这篇解决vue.js在编写过程中出现空格不规范报错的问题就是小编分享给大家的全部内容了,希望能给大家一个参考

  • JS实现多级菜单中当前菜单不随页面跳转样式而发生变化

    JS实现多级菜单中当前菜单不随页面跳转样式而发生变化

    一.概述 本文介绍了JQuery巧妙实现多级菜单中当前菜单不随页面跳转样式发生变化,貌似没看懂啥意思? 看图说话:就是点二级或多级菜单时,父级展开,当前菜单是被选中状态,这下明白了吧? 二.应用场景 当一个项目使用公共模板文件时(如上图的左侧菜单栏),我们给每个子菜单添加链接时,点击页面跳转样后还是公共模板的样式,这时就需要实现动态加载当前菜单的样式. 三.实现方法 第一种:.通过php传递变量,模板页面通过接收这些变量来实现当前页面的菜单选中与否,父级展开等这些样式 缺点:虽然实现简单,但是每

  • Angular外部使用js调用Angular控制器中的函数方法或变量用法示例

    Angular外部使用js调用Angular控制器中的函数方法或变量用法示例

    本文实例讲述了Angular外部使用js调用Angular控制器中的函数方法或变量.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html ng-app="myApp" id="myApp"> <head> <meta name="viewport" content="width=device-width" /> <title>Test</

  • JS实现从表格中动态删除指定行的方法

    本文实例讲述了JS实现从表格中动态删除指定行的方法.分享给大家供大家参考.具体如下: JS的表格对象有一个deleteRow方法用于删除表格中的指定行,只需要指定行号即可 <!DOCTYPE html> <html> <head> <script> function deleteRow(r) { var i=r.parentNode.parentNode.rowIndex; document.getElementById('myTable').deleteR

  • js基础之DOM中document对象的常用属性方法详解

    -----引入 每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问. 属性 1  document.anchors  返回对文档中所有 Anchor 对象的引用.还有document.links/document.forms/document.images等 2  document.URL       返回当前文档的url 3  document.title       返回当前文档的标题 4  do

  • js表单处理中单选、多选、选择框值的获取及表单的序列化

    本文总结了下在表单处理中单选.多选.选择框值的获取及表单的序列化,写成了一个对象.如下: var formUtil = { // 获取单选按钮的值,如有没有选的话返回null // elements为radio类的集合的引用 getRadioValue:function(elements) { var value = null; // null表示没有选中项 // 非IE浏览器 if(elements.value != undefined && elements.value != '')

随机推荐