-
UID:99694
-
- 注册时间2008-12-21
- 最后登录2010-01-11
- 在线时间0小时
-
- 发帖40
- 搜Ta的帖子
- 精华0
- 贡献值1
- 威望值33
- 技术分0
- 织梦币0
-
访问TA的空间加好友用道具
|

【全功能全自动适应图片大小幻灯片已经修改完毕】2009年3月1日,紫将龙天祁重新制作版 今天看了看论坛中高手们制作的幻灯片由一个轮换的比较好的之前看到一个前辈制作的幻灯很受欢迎,不过只有两个缺点不能动态载入,那其二就是不能自动适应图片的大小,这样对于站长来说,每次缩略图都要手动添加那样的话非常麻烦,我修改了代码,整理的FLASH源文件之后已经将以上两点完全解决。故此发出来和大家共享。
测试方法,将以下代码插入<head></head>中 <script language="javascript" type="text/javascript">
<!-- $(function(){ $("dl.tbox dt span.label a[_for]").mouseover(function(){ $(this).parents("span.label").children("a[_for]").removeClass("thisclass").parents("dl.tbox").children("dd").hide(); $(this).addClass("thisclass").blur(); $("#"+$(this).attr("_for")).show(); }); $("a[_for=uc_member]").mouseover(); });
function CheckLogin(){ var taget_obj = document.getElementById('_userlogin'); myajax = new DedeAjax(taget_obj,false,false,'','',''); myajax.SendGet2("{dede:global.cfg_cmspath/}/member/ajax_loginsta.php"); DedeXHTTP = null; } --> </script> <link href="../style/dedecms.css" rel="stylesheet" type="text/css" /> <style type="text/css"> /* Reset style */ * { margin:0; padding:0; word-break:break-all; } body { background:#FFF; color:#333; font:12px/1.6em Helvetica, Arial, sans-serif; } h1, h2, h3, h4, h5, h6 { font-size:1em; } a { color:#0287CA; text-decoration:none; } a:hover { text-decoration:underline; } ul, li { list-style:none; } fieldset, img { border:none; } legend { display:none; } em, strong, cite, th { font-style:normal; font-weight:normal; } input, textarea, select, button { font:12px Helvetica, Arial, sans-serif; } table { border-collapse:collapse; } html { overflow:-moz-scrollbars-vertical; } /*Always show Firefox scrollbar*/
/* iFocus style */ #ifocus { width:525px; height:245px; margin:20px; border:1px solid #DEDEDE; background:#F8F8F8; } #ifocus_pic { display:inline; position:relative; float:left; width:410px; height:225px; overflow:hidden; margin:10px 0 0 10px; } #ifocus_piclist { position:absolute; } #ifocus_piclist li { width:410px; height:225px; overflow:hidden; } #ifocus_piclist img { width:410px; height:225px; } #ifocus_btn { display:inline; float:right; width:91px; margin:9px 9px 0 0; } #ifocus_btn li { width:91px; height:57px; cursor:pointer; opacity:0.5; -moz-opacity:0.5; filter:alpha(opacity=50); } #ifocus_btn img { width:75px; height:45px; margin:7px 0 0 11px; } #ifocus_btn .current { background: url(images/ifocus_btn_bg.gif) no-repeat; opacity:1; -moz-opacity:1; filter:alpha(opacity=100); } #ifocus_opdiv { position:absolute; left:0; bottom:0; width:410px; height:35px; background:#000; opacity:0.5; -moz-opacity:0.5; filter:alpha(opacity=50); } #ifocus_tx { position:absolute; left:8px; bottom:8px; color:#FFF; } #ifocus_tx .normal { display:none; } </style> 下面是实用片段: <div id="ifocus"> <div id="ifocus_pic"> <div id="ifocus_piclist" style="left:0; top:0;"> <ul> {dede:arclist flag='f' row='5'} <li><a href="[field:arcurl/]" title="[field:title function='html2text(@me)'/]" target=_blank><img src="[field:litpic/]" alt="[field:title/]" /></a></li> {/dede:arclist} </ul> </div> <div id="ifocus_opdiv"></div> <div id="ifocus_tx"> <ul> {dede:arclist flag='f' row='1' limit='0,1'} <li class="current">[field:title/]</li> {/dede:arclist} {dede:arclist flag='f' row='4'limit='1,1'} <li class="normal">[field:title/]</li> {/dede:arclist} {dede:arclist flag='f' row='4'limit='2,1'} <li class="normal">[field:title/]</li> {/dede:arclist} {dede:arclist flag='f' row='4'limit='3,1'} <li class="normal">[field:title/]</li> {/dede:arclist} {dede:arclist flag='f' row='4'limit='4,1'} <li class="normal">[field:title/]</li> {/dede:arclist} </ul> </div> </div> <div id="ifocus_btn"> <ul> {dede:arclist flag='f' row='4' limit='0,1'} <li class="current"><img src="[field:litpic/]" alt="[field:title function='html2text(@me)'/]" /></li> {/dede:arclist} {dede:arclist flag='f' row='4' limit='1,1'} <li class="normal"><img src="[field:litpic/]" alt="[field:title function='html2text(@me)'/]" /></li> {/dede:arclist} {dede:arclist flag='f' row='4' limit='2,1'} <li class="normal"><img src="[field:litpic/]" alt="[field:title function='html2text(@me)'/]" /></li> {/dede:arclist} {dede:arclist flag='f' row='4' limit='3,1'} <li class="normal"><img src="[field:litpic/]" alt="[field:title function='html2text(@me)'/]" /></li> {/dede:arclist} </ul> </div> </div><!--ifocus end-->
如果大家觉得这样很乱的话可以分开将CSS片段加载到dedecms.css 和将JS片段记载一个标题.js加载在头部文件中也可以 本人专职制作dedecms模板,全手写或者仿站都可以,总之来说,全手写的肯定相对来说贵一些,因为没有沉余代码嘛,准备好资料就可以联系我了,我的Q号381522534价格Q谈 好了,今天就先介绍这一个幻灯以解决大家的大问题吧,以后有的是时间分享我的好东西。 [ 此帖被zilong8599在2009-03-02 01:49重新编辑 ]
|