源码:<!doctype html><html lang="en"><head><meta charset="utf-8"><title>CollagePlus for jQuer ...
源码:
<!doctype html><html lang="en"><head><meta charset="utf-8"><title>CollagePlus for jQuery Example</title><link rel="stylesheet" type="text/css" href="../support/examples.css" media="all" /><link rel="stylesheet" type="text/css" href="../css/transitions.css" media="all" /><!--[if lt IE 9]> <script src='/images/loading.gif' data-original="http://www.cnblogs.com///ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <![endif]--><!--[if (gte IE 9) | (!IE)]><!--><script src='/images/loading.gif' data-original="jquery.js"></script><!--<![endif]--><!--[if IE]> <script src='/images/loading.gif' data-original="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--><script src='/images/loading.gif' data-original="../jquery.collagePlus.js"></script><script src='/images/loading.gif' data-original="../jquery.removeWhitespace.js"></script><script src='/images/loading.gif' data-original="../jquery.collageCaption.js"></script><script type="text/javascript"> // All images need to be loaded for this plugin to work so // we end up waiting for the whole window to load in this example $(window).load(function () { $(document).ready(function(){ collage(); $('.Collage').collageCaption(); }); }); // Here we apply the actual CollagePlus plugin function collage() { $('.Collage').removeWhitespace().collagePlus( { 'fadeSpeed' : 2000, 'targetHeight' : 200 } ); }; // This is just for the case that the browser window is resized var resizeTimer = null; $(window).bind('resize', function() { // hide all the images until we resize them $('.Collage .Image_Wrapper').css("opacity", 0); // set a timer to re-apply the plugin if (resizeTimer) clearTimeout(resizeTimer); resizeTimer = setTimeout(collage, 200); }); </script></head><body><div ><a href="http://www.100sucai.com">100sucai.com</a></div><section > <div data-caption="This is some data <u>with</u>html in it"><a href="http://www.100sucai.com"><img src='/images/loading.gif' data-original="01.gif"></a></div> <div data-caption="This is some data <u>with</u>html in it. Also a really long sentence with a <a href="http://www.100sucai.com">link</a> in it"><a href="http://www.100sucai.com"><img src='/images/loading.gif' data-original="02.gif"></a></div> <div data-caption="This is some data <u>with</u>html in it This is some data <u>with</u>html in it. Also a really long sentence with a <a href="http://www.100sucai.com">link</a> in it This is some data <u>with</u>html in it. Also a really long sentence with a <a href="http://www.100sucai.com">link</a> in it"><a href="http://www.100sucai.com"><img src='/images/loading.gif' data-original="03.gif"></a></div> <div data-caption="This is some data <u>with</u>html in it This is some data <u>with</u>html in it. Also a really long sentence with a <a href="http://www.100sucai.com">link</a> in it"><a href="http://www.100sucai.com"><img src='/images/loading.gif' data-original="04.gif"></a></div> <div data-caption="This is some data <u>with</u>html in it"><a href="http://www.100sucai.com"><img src='/images/loading.gif' data-original="05.gif"></a></div> <div data-caption="This is some data <u>with</u>html in it This is some data <u>with</u>html in it. Also a really long sentence with a <a href="http://www.100sucai.com">link</a> in it"><a href="http://www.100sucai.com"><img src='/images/loading.gif' data-original="06.gif"></a></div></section></body></html>
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:鼠标悬浮图片时弹出透明提示图层的jQuery特效
关键词:jquery
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。