我不能运行我的jQuery代码作为工具

我想用我的网页的this jQuery库。我复制所有代码在文章页面，然后粘贴到我的.html文件如下：我不能运行我的jQuery代码作为工具

<html> 
    <head> 
     <script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script> 
     <script type="text/javascript"> 
      $("document").ready(function(){ 
       $("#demo img[title]").tooltip(); 
      }); 
     </script> 
    </head> 
    <body> 
    <br /> 
    <br /> 
     <div id="demo"> 
      <img src="image1.jpg" title="The tooltip text #1"/> 
      <img src="image2.jpg" title="The tooltip text #2"/> 
      <img src="image3.jpg" title="The tooltip text #3"/> 
      <img src="image4.jpg" title="The tooltip text #4"/> 
     </div> 
    </body> 
</html>

但.tooltip类样式没有运行。我看不到背景图片和其他图片。如何编辑我的.html文件？

另外，如果我想改变这个库的CSS样式，我该怎么办？

来源

2012-06-24 Birlikisgu

你添加链接的CSS文件....？ –

其中是http://jquerytools.org/demos/tooltip/index.html中的css文件 – Birlikisgu

您是否收到任何错误？ –

工作演示http://jsfiddle.net/QWeKw/2/或http://jsfiddle.net/XUhxQ/

你可以使自己的造型。

很好的链接：http://jquery.bassistance.de/tooltip/demo/或http://docs.jquery.com/Plugins/Tooltip

这应有助于，

代码

$("img[title]").tooltip({ 
    events: { 
     def:  "mouseenter,mouseleave", // default show/hide events for an element 
     input: "focus,blur",    // for all input elements 
     widget: "focus click,blur", // select, checkbox, radio, button 
     tooltip: "mouseenter,mouseleave"  // the tooltip element 
    } 
});

CSS里面演示

.tooltip { 
    font-family:tahoma; 
    background-color: #000000; 
    border: 1px solid #FFFFFF; 
    box-shadow: 0 0 10px #000000; 
    color: #FFFFFF; 
    display: none; 
    font-size: 12px; 
    padding: 10px 15px; 
    text-align: left; 
    width: 200px; 
}

工作图像

enter image description here

来源

2012-06-24 09:40:51

为什么我不能在http://jquerytools.org/demos/tooltip/index.html中使用css风格？ – Birlikisgu

@Birlikisgu哈哈是的，你可以使用CSS（http://www.jquerytools.org/demos/tooltip/index.html），我只是给你一个额外的信息，如果你知道更多关于插件和东西':) '看**工作演示/代码**，你会发现什么是错的，有一个很好的！ –

-1

如果你把alert("HI");放入你的javascript中，它会显示吗？

另外，<!doctype html>应该在最上面。

对于CSS，把这个头：<link rel="stylesheet" type="text/css" href="mystyle.css" />

来源

2012-06-24 09:38:20 Alexander

我没有css文件。 – Birlikisgu

只需创建一个空文件。你可以开始加入：'body {background-color：pink; }'，例如 – Alexander

好了演示中，添加这种风格里面你头标签：

<style> 

     .tooltip { 
     display:none; 
     background:transparent url(http://jquerytools.org/media/img/tooltip/black_arrow.png); 
     font-size:12px; 
     height:70px; 
     width:160px; 
     padding:25px; 
     color:#eee; 
     } 
     /* style the trigger elements */ 
     #demo img { 
     border:0; 
     cursor:pointer; 
     margin:0 1px; 
     } 
</style> 
<!--[if lt IE 7]> 
<style> 
    .tooltip { 
    background-image:url(http://jquerytools.org/media/img/tooltip/black_arrow.gif); 
    } 
</style> 
<![endif]-->

来源

2012-06-24 09:42:34

我不能运行我的jQuery代码作为工具

回答

相关问题