jquery.mytooltip插件鼠标悬停文字提示代码.zip

  • q6_706851
    了解作者
  • 60KB
    文件大小
  • zip
    文件格式
  • 0
    收藏次数
  • VIP专享
    资源类型
  • 0
    下载次数
  • 2022-06-09 23:20
    上传日期
jquery.mytooltip插件鼠标悬停文字提示代码
jquery.mytooltip插件鼠标悬停文字提示代码.zip
  • jquery.mytooltip插件鼠标悬停文字提示代码
  • jquery.mytooltip.js
    15.9KB
  • php中文网下载站.url
    114B
  • jquery-1.11.3.min.js
    93.7KB
  • 1.jpg
    20.6KB
  • jquery.mytooltip.css
    2.6KB
  • index.html
    22.5KB
  • demo
  • style.css
    3.9KB
  • script.js
    2.4KB
内容介绍
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jquery.mytooltip插件鼠标悬停文字提示代码</title> <link rel="stylesheet" href="jquery.mytooltip.css"> <link rel="stylesheet" href="demo/style.css"> <script src="jquery-1.11.3.min.js"></script> <script src="jquery.mytooltip.js"></script> <script src="demo/script.js"></script> </head> <body><script src="/demos/googlegg.js"></script> <div class="content" id="start-example"> <div class="content-block content-first"> <div class="content-block-inner"> <h2 class="content-title">Directions</h2> <h3 class="content-subtitle">Directions tooltips</h3> <div class="js-mytooltip type-inline-block style-block style-block-one" data-mytooltip-custom-class="align-center" data-mytooltip-template="站长素材">Top </div> <br> <code>data-mytooltip-direction=<span class="code-string">"top"</span></code> or <code>direction:<span class="code-string">'top'</span></code> <span class="code-info">- This default value</span> <br> <br> <div class="js-mytooltip type-inline-block style-block style-block-one" data-mytooltip-custom-class="align-center" data-mytooltip-direction="right" data-mytooltip-template=".tooltip-content-dom">Right </div> <br> <code>data-mytooltip-direction=<span class="code-string">"right"</span></code> or <code>direction:<span class="code-string">'right'</span></code> <br> <br> <div class="js-mytooltip type-inline-block style-block style-block-one" data-mytooltip-custom-class="align-center" data-mytooltip-direction="left" data-mytooltip-template="Direction left">Left </div> <br> <code>data-mytooltip-direction=<span class="code-string">"left"</span></code> or <code>direction:<span class="code-string">'left'</span></code> <br> <br> <div class="js-mytooltip type-inline-block style-block style-block-one" data-mytooltip-custom-class="align-center" data-mytooltip-direction="bottom" data-mytooltip-template="Direction bottom">Bottom </div> <br> <code>data-mytooltip-direction=<span class="code-string">"bottom"</span></code> or <code>direction:<span class="code-string">'bottom'</span></code> <br> <br> </div> </div> <div class="content-block content-second"> <div class="content-block-inner"> <h2 class="content-title">Offset</h2> <h3 class="content-subtitle">Оffset tooltips</h3> <div class="js-mytooltip type-inline-block style-block style-block-two" data-mytooltip-custom-class="align-center" data-mytooltip-template="Offset default - 10px">Default </div> <br> <code>data-mytooltip-offset=<span class="code-number">10</span></code> or <code>offset:<span class="code-number">10</span></code> <span class="code-info">- This default value</span> <br> <br> <div class="js-mytooltip type-inline-block style-block style-block-two" data-mytooltip-custom-class="align-center" data-mytooltip-offset="20" data-mytooltip-direction="left" data-mytooltip-template="Offset 20px">Offset custom </div> <br> <code>data-mytooltip-offset=<span class="code-number">20</span></code> or <code>offset:<span class="code-number">20</span></code> <br> <br> </div> </div> <div class="content-block content-first"> <div class="content-block-inner"> <h2 class="content-title">Templates</h2> <h3 class="content-subtitle">Plain text or great HTML template</h3> <div class="js-mytooltip type-inline-block style-block style-block-three" data-mytooltip-custom-class="align-center" data-mytooltip-direction="right" data-mytooltip-template="<strong>plain text</strong>">hover to me </div> <br> <code>data-mytooltip-template<span class="code-string">"&lt;strong>plain text&lt;/strong>"</span></code> or <code>template:<span class="code-string">'plain text'</span></code> <br> or add selector a string <code style="margin-top: 10px;"><span class="code-string">'.content-class'</span></code> <br> <br> <p><strong>Hover link: "Mars"</strong></p> <p>The chemicals allow the water to remain liquid at lower temperatures but also help keep it from boiling off in the thin atmosphere of <a class="js-mytooltip-template" data-mytooltip-direction="right" href="#" rel='nofollow' onclick='return false;'>Mars</a>,<br> the researchers said.</p> <div class="js-mytooltip type-inline-block style-block style-block-three" data-mytooltip-custom-class="align-center" data-mytooltip-direction="right" data-mytooltip-dinamic-template="true" data-mytooltip-template="<div class='wrap'><a class='add-to-basket' href='#' rel='nofollow' onclick='return false;'>Add to basket</a><span class='count'>17</span></div>">dinamic template </div> <br> <code>data-mytooltip-dinamic-template=<span class="code-boolean">true</span></code> or <code>dinamicTemplate:<span class="code-boolean">true</span></code> <br> <br> </div> </div> <div class="content-block content-second"> <div class="content-block-inner"> <h2 class="content-title">Animation</h2> <h3 class="content-subtitle">Animation options</h3> <div class="js-mytooltip type-inline-block style-block style-block-four" data-mytooltip-custom-class="align-center" data-mytooltip-template="Slow animate duration - 200mc">Animate duration default </div> <br> <code>data-mytooltip-animate-duration=<span class="code-number">200</span></code> or <code>animateDuration:<span class="code-number">200</span></code> <span class="code-info">- This default value</span> <br> <br> <div class="js-mytooltip type-inline-block style-block style-block-four" data-mytooltip-animate-duration="100" data-mytooltip-custom-class="align-center" data-mytooltip-direction="left" data-mytooltip-template="Slow animate duration - 100mc">Fast animate duration </div> <br> <code>data-mytooltip-animate-duration=<span class="code-number">100</span></code> or <code>animateDuration:<span class="code-number">100</span></code> <br> <br> <div class="js-mytooltip type-inline-block style-block style-block-four" data-mytooltip-animate-duration="400" data-mytooltip-custom-class="align-center" data-mytooltip-template="Slow animate duration - 400mc">Slow animate duration </div> <br> <code>data-mytooltip-animate-duration=<span class="code-number">400</span></code> or <code>animateDuration:<span class="code-number">400</span></code> <br> <br> <div class="js-mytooltip type-inline-block style-block style-block-four" data-mytooltip-custom-class="align-center" data-mytooltip-direction="left" data-mytooltip-template="Animate offset 15px">Animate offset default </div> <br> <code>data-mytooltip-animate-offset-px=<span class="code-number">15</span></code> or <code>animateOffsetPx:<span class="code-number">15</span></code> <span class="code-info">- This default value</span> <br> <br> <div class="js-mytooltip type-inline-block style-block style-block-four" data-mytooltip-custom-class="align-center" data-mytooltip-direction="right" data-mytooltip-animate-offset-px="40" data-mytooltip-template="Animate offset 40px">Animate off
评论
    相关推荐
    • jQuery
      jQuery
    • jQuery
      jQuery
    • jQuery
      jQuery
    • jQuery
      jQuery
    • jquery1.32
      jquery-1.3.2.min.js 最新 jquery-1.2.6-vsdoc-cn.js 中文注释版 jquery-1.2.6.pack.js 压缩后的直接使用(推荐) jquery-1.2.6.min.js 精简的版本(学习用) jquery-1.2.6.js 学习用的(97k) jquery_0.js 初始版
    • JQuery资料
      JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 JQuery资料 ...
    • jqueryDemo
      初学jquery的非常不错的demo (描述重点就可以了啊。还要有字数的限制。。 初学jquery的非常不错的demo 初学jquery的非常不错的demo 初学jquery的非常不错的demo )
    • jquery
      jquery
    • jquery
      Ajax使用例子(jQuery)
    • JQuery
      jQuery查询