zoukankan      html  css  js  c++  java
  • jquery 提示插件 cluetip

     jquery的 插件cluetip,

    地址下载是:plugins.learningjquery.com/cluetip/demo/

     下面简单讲解下用法:

    1 首先当然要放JQUERY的基本JS,和这个插件的JS了,如:

       <a class="title" href="#" title="This is the title|The first set of contents comes after the first delimiter.....

       $('a.title').cluetip({splitTitle: '|'});

      这样就会在该连接被点时,弹出一个框,标题是this is the title,内容是|号后面的内容了

    2 也可以弹出的内容是个连接,比如
       <a class="basic" href="ajax.htm" rel="ajax.htm">

      $('a.basic').cluetip();

    3 定义弹出框的高度大小等:

       <a class="custom-width" href="ajax3.htm" rel="ajax3.htm">

    $('a.custom-width').cluetip({ '200px', showTitle: false});

    4 当鼠标移动到某连接时弹出:

      <h4 title="Fancy Title!" id="ajax3.htm">Hover over me</h4>

    $('h4').cluetip({attribute: 'id', hoverClass: 'highlight'});

    5 当用户主动点这个连接时,才弹出提示
       <a href="ajaxclick.htm" rel="ajax5.htm" title="active ingredients">

    $('#clickme').cluetip({activation: 'click', 650});

    6 圆角的
      <a href="ajax4.htm" title="|first line body|second line body">

    $('ol.rounded a:eq(0)').cluetip({splitTitle: '|', dropShadow: false, cluetipClass: 'rounded', showTitle: false});

  • 相关阅读:
    NC 5的开发环境起不了客户端
    NC 6系初始化EJB
    ubuntu安装javaweb
    html 优化
    ubuntu
    jquery
    前端优化
    京东设计中心
    html cookie
    html5 use video camera
  • 原文地址:https://www.cnblogs.com/youxin/p/3832547.html
Copyright © 2011-2022 走看看