seobo | 发表于:10-11-30 00:01 [添加收藏] 楼主 [回复] #Top# |
---|---|
![]() ![]() ![]() ![]() |
Ta最近还发表过
[疑问]
有人用KINGCMS-PHP企业版本做个产品放大镜没?
(14-07-25)
随机阅读
[其他]
我参团了
(12-09-06)
[疑问]
PHP(sp2) 静态页生成路径问题
(12-07-02)
[其他]
今天上午kingcms网站打不开
(12-05-08)
[帮助]
地方站访谈:天时地利人和打造新“地宝网”
(11-11-18)
[疑问]
什么叫“同一个模块的升级,是终身免费的。”?
(11-05-20)
|
SinCS | 发表于:10-11-30 07:25 沙发 [回复] #Top# |
---|---|
![]() ![]() ![]() ![]() ![]() |
那个功能不过是javascript而已吧?
|
seobo | 发表于:10-11-30 16:25 板凳 [回复] #Top# |
---|---|
![]() ![]() ![]() ![]() |
求高人指点
|
99163 | 发表于:10-11-30 23:14 4楼 [回复] #Top# |
---|---|
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
可以, 只要能看到的,都有办法弄.
|
xydirk | 发表于:10-12-02 14:11 5楼 [回复] #Top# |
---|---|
![]() ![]() ![]() ![]() |
那个不是js写的吗,关kc啥事啊。。。
|
azoon | 发表于:10-12-02 20:05 6楼 [回复] #Top# |
---|---|
![]() ![]() ![]() ![]() ![]() ![]() |
。。。。很简单的。。我做的多了。
|
veryus | 发表于:11-01-04 00:27 7楼 [回复] #Top# |
---|---|
![]() ![]() ![]() ![]() |
最后后面有一个jqzoom.js文件内容,要在模板里加载好。然后再加上这样一段代码放在你的模板的<body>区:
<script type="text/javascript"> $(function(){ $(".jqzoom").jqueryzoom({ xzoom:460, yzoom:460, offset:10, position:"right", preload:1, lens:1 }); }) </script> 放大镜那一块的html代码是这样的: <div id="preview"> <div class="jqzoom"> <img src="../{king:Image/}" jqimg="../{king:Image/}" /> </div> </div> 对应的CSS是: #preview {float:left; margin:10px auto; text-align:center; width:200px;} .jqzoom {width:200px; height:180px; position:relative;margin:0 0 0 10px;} .jqzoom img{ width:200px; height:180px; float:left;border:#1a1f5b 3px solid;} .zoomdiv {left:1000px; height:600px; width:600px;} .list-h li {float:left;} /*jqzoom*/ .zoomdiv{z-index:100;position:absolute;top:1px;left:0px;width:250px;height:250px;border:1px solid #e4e4e4;display:none;text-align:center;overflow: hidden;} .jqZoomPup{z-index:10;visibility:hidden;position:absolute;top:0px;left:0px;width:30px;height:30px;border:1px solid #aaa;background:#FEDE4F 50% top no-repeat;opacity:0.5;-moz-opacity:0.5;-khtml-opacity:0.5;filter:alpha(Opacity=50);cursor:move;} 上面的数值可以根据自己的需要来调大小的哈! jquery.js文件一般不需要特别加载,因为你在使用{king:title/}时,会自动加载这个文件,但是可能会碰到问题,因为使用{king:title/}时,会自动加载两个js文件:jquery.js和jquery.kc.js,这样就会有冲突,解决的办法是: 一、去system/lib/找到kc_template_class.php,文件,打开后,删掉第36行(版本不同,可能不一样,内容如下: $s=preg_replace('%(</title[^>]*>)%s',"${1}n<meta name="generator" content="KingCMS"/>n<script type="text/javascript" src="".$king->config('inst')."system/js/jquery.js"></script>n<script type="text/javascript" src="".$king->config('inst')."system/js/jquery.kc.js"></script>",$s,1);)这样,当你使用{king:title/}时,就不会加载上述两个js文件。 二、在制作的模板中,自己加载一下system/js/jquery.js文件 三、去system/skin/下,修改两个后台模板文件,加载好jquery.js和jquery.kc.js,放在fun.js的前面。这是后台要用的,不能少。 我这方法比较笨,不过确实能够实现。因为我不懂修改JS,没办法,只好这样搞。 jqzoom.js文件内容如下: /*jqueryzoom&&jcarousel*/ (function($){ $.fn.jqueryzoom=function(options){ var settings={ xzoom:200, yzoom:200, offset:10, position:"right", lens:1, preload:1}; if(options){ $.extend(settings,options);} var noalt=''; $(this).hover(function(){ var imageLeft=$(this).offset().left; var imageTop=$(this).offset().top; var imageWidth=$(this).children('img').get(0).offsetWidth; var imageHeight=$(this).children('img').get(0).offsetHeight; noalt=$(this).children("img").attr("alt"); var bigimage=$(this).children("img").attr("jqimg"); $(this).children("img").attr("alt",''); if($("div.zoomdiv").get().length==0){ $(this).after("<div class='zoomdiv'><img class='bigimg' src='"+bigimage+"'/></div>"); $(this).append("<div class='jqZoomPup'> </div>");} if(settings.position=="right"){ if(imageLeft+imageWidth+settings.offset+settings.xzoom>screen.width){ leftpos=imageLeft-settings.offset-settings.xzoom;}else{ leftpos=imageLeft+imageWidth+settings.offset;}}else{ leftpos=imageLeft-settings.xzoom-settings.offset; if(leftpos<0){ leftpos=imageLeft+imageWidth+settings.offset;}} $("div.zoomdiv").css({top:imageTop,left:leftpos}); $("div.zoomdiv").width(settings.xzoom); $("div.zoomdiv").height(settings.yzoom); $("div.zoomdiv").show(); if(!settings.lens){ $(this).css('cursor','crosshair');} $(document.body).mousemove(function(e){ mouse=new MouseEvent(e); var bigwidth=$(".bigimg").get(0).offsetWidth; var bigheight=$(".bigimg").get(0).offsetHeight; var scaley='x'; var scalex='y'; if(isNaN(scalex)|isNaN(scaley)){ var scalex=(bigwidth/imageWidth); var scaley=(bigheight/imageHeight); $("div.jqZoomPup").width((settings.xzoom)/(scalex*1)); $("div.jqZoomPup").height((settings.yzoom)/(scaley*1)); if(settings.lens){ $("div.jqZoomPup").css('visibility','visible');}} xpos=mouse.x-$("div.jqZoomPup").width()/2-imageLeft; ypos=mouse.y-$("div.jqZoomPup").height()/2-imageTop; if(settings.lens){ xpos=(mouse.x-$("div.jqZoomPup").width()/2 < imageLeft ) ? 0 : (mouse.x + $("div.jqZoomPup").width()/2>imageWidth+imageLeft)?(imageWidth-$("div.jqZoomPup").width()-2):xpos; ypos=(mouse.y-$("div.jqZoomPup").height()/2 < imageTop ) ? 0 : (mouse.y + $("div.jqZoomPup").height()/2>imageHeight+imageTop)?(imageHeight-$("div.jqZoomPup").height()-2):ypos;} if(settings.lens){ $("div.jqZoomPup").css({top:ypos,left:xpos});} scrolly=ypos; $("div.zoomdiv").get(0).scrollTop=scrolly*scaley; scrollx=xpos; $("div.zoomdiv").get(0).scrollLeft=(scrollx)*scalex;});},function(){ $(this).children("img").attr("alt",noalt); $(document.body).unbind("mousemove"); if(settings.lens){ $("div.jqZoomPup").remove();} $("div.zoomdiv").remove();}); count=0; if(settings.preload){ $('body').append("<div style='display:none;' class='jqPreload"+count+"'>360buy</div>"); $(this).each(function(){ var imagetopreload=$(this).children("img").attr("jqimg"); var content=jQuery('div.jqPreload'+count+'').html(); jQuery('div.jqPreload'+count+'').html(content+'<img src="'+imagetopreload+'">');});}}})(jQuery); function MouseEvent(e){ this.x=e.pageX; this.y=e.pageY;} |
veryus | 发表于:11-01-04 00:30 8楼 [回复] #Top# |
---|---|
![]() ![]() ![]() ![]() |
如果对你有帮助,请帮我一把,解决一下以下的问题:
http://www.kingcms.com/forums/Ask/t13940/ |
p249434876 | 发表于:12-03-13 10:24 9楼 [回复] #Top# |
---|---|
![]() ![]() |
那个不是js写的吗,关kc啥事啊。。。
|
yuesheyu | 发表于:12-03-13 11:19 10楼 [回复] #Top# |
---|---|
![]() ![]() |
来看下高手怎么解决的
|