动感的Tip提示效果，基于jquery的代码实现资源-CSDN文库

共7个文件

gif：2个

html：1个

png：1个

jquery

2星需积分: 9 33 浏览量 2010-08-18 15:28:03 上传评论收藏 119KB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

动感的Tip提示效果，基于jquery的代码实现.rar （7个子文件）

codefans.net

demo

css

index.css 3KB

images

Download_Button_o.gif 2KB

black_arrow_big.png 4KB

Thumbs.db 117KB

Download_Button.gif 2KB

tools_jquery.js 95KB

index.html 3KB

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" > <meta http-equiv="Content-Style-Type" content="text/css" > <meta http-equiv="Content-Script-Type" content="text/javascript" > <meta name="description" content=""> <meta name="keywords" content=""> <title>HTML inside the Tip Box – Sunflowa Media Web Site</title> <link rel="stylesheet" type="text/css" href="http://www.sunflowamedia.com/css/import.css" media="all"> <link rel="stylesheet" type="text/css" href="css/index.css" media="all"> <link rel="shortcut icon" href="http://www.sunflowamedia.com/images/favicon.ico"> <script type="text/javascript" src="js/tools_jquery.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#download_now").tooltip({ effect: 'slide'}); }); </script> </head> <body> <div id="wrapper">  <div id="container"> <div id="wrap-container" class="clearfix"> <h2 class="title_name">HTML inside the <span>Tip Box</span><small>by Sunflowa Media</small></h2> <div class="examples_body"> <h3>Demo1</h3>  <a id="download_now">Download now</a>  <div class="tooltip"> <p>Sunflowa Media - Green,Reliable,Funny Web Design.</p> <p>Hey, I'm Airos Chou.I am a freelance web designer & graphic designer based in Shanghai, CN. I make Green Environment Protection website, accessible websites that are easy to use and easy for our life. I'm in love with web standards xhtml/css.</p> <p><a href="/index.php">http://www.sunflowamedia.com</a></p> </div> <p class="txt">Tooltip content can be any HTML, not just plain text. Move your mouse over the Download button and you'll see a tooltip that contains an image, table and a link element. You can also see the slide effect in action.</p> <p class="txt">You have enough time to move your cursor away from the trigger element and place it on top of the link that is contained inside the tooltip. You can also customize this delay from the tooltip configuration.</p> <p class="txt">Note that if the trigger has a title attribute then the manual tooltip won't be displayed because the title attribute overrides the manual tooltip.</p>  </div> </div> </div>  <div class="copyright"> <p>Copyright©2006-2010 <a href="http://www.sunflowamedia.com/">Sunflowa Media</a> All Rights Reserved.</p>  </div> </div> </body> </html>

评论收藏

内容反馈