Hallo zusammen
Ich habe eine weitere Frage:
Im Javascript-Teil würde ich gerne die beiden Funktionen in den img-tag einbinden:
onmouseover="showInfo()" onmouseout="clearInfo()"
Wie muss ich das im Javascript einfügen?
Reicht das so?
Danke euch!
Gruss,
swissPHP
Ich habe eine weitere Frage:
Im Javascript-Teil würde ich gerne die beiden Funktionen in den img-tag einbinden:
onmouseover="showInfo()" onmouseout="clearInfo()"
Wie muss ich das im Javascript einfügen?
HTML:
<a class="sp-current-big" href="1 - 0001.jpg"><img onmouseover="showInfo()" onmouseout="clearInfo()" alt="" src="1 - 0001.jpg"></a>
Code:
!function(a){a.fn.extend({smoothproducts:function(){var b=300;a(".sp-wrap").append('<div class="sp-large"></div><div class="sp-thumbs sp-tb-active"></div>'),a(".sp-wrap").each(function(){a("a",this).appendTo(a(".sp-thumbs",this)),a(".sp-thumbs a:first",this).addClass("sp-current").clone().removeClass("sp-current").appendTo(a(".sp-large",this)).addClass("sp-current-big"),a(".sp-wrap").css({display:"inline-block"})}),a(document.body).on("click",".sp-thumbs",function(a){a.preventDefault()}),a(document.body).on("click",".sp-tb-active a",function(c){a(this).parent().find(".sp-current").removeClass(),a(this).parent().parent().find(".sp-thumbs").removeClass("sp-tb-active"),a(this).parent().parent().find(".sp-zoom").remove(),a(this).parent().parent().find(".sp-full-screen").fadeOut(function(){a(this).remove()});var d=a(this).parent().parent().find(".sp-large").height(),e=a(this).parent().parent().find(".sp-large").width();a(this).parent().parent().find(".sp-large").css({overflow:"hidden",height:d+"px",width:e+"px"}),a(this).parent().parent().find(".sp-large a").remove(),a(this).addClass("sp-current").clone().hide().removeClass("sp-current").appendTo(a(this).parent().parent().find(".sp-large")).addClass("sp-current-big").fadeIn(b,function(){var b=a(this).parent().parent().find(".sp-large img").height();a(this).parent().parent().find(".sp-large").animate({height:b},"fast",function(){a(".sp-large").css({height:"100%",width:"auto"})}),a(this).parent().parent().find(".sp-thumbs").addClass("sp-tb-active")}),c.preventDefault()}),a(document.body).on("click",".sp-large a",function(b){var c=a(this).attr("href");a(this).parent().parent().find(".sp-large").append('<div class="sp-zoom"><img src="'+c+'" style="width: 100%"/></div>'),a(this).parent().parent().find(".sp-zoom").fadeIn(),a(this).parent().parent().find(".sp-zoom").draggable(),/*a(this).parent().parent().prepend('<div class="sp-full-screen"><a href="#">\u2195</a></div>'),*/b.preventDefault()}),a(document.body).on("click",".sp-full-screen",function(){var c=a(this).parent().find(".sp-large .sp-zoom").html();a("body").append("<div class='sp-lightbox'>"+c+"</div>"),a(".sp-lightbox").fadeIn()}),a(document.body).on("click",".sp-lightbox",function(){a(this).fadeOut(function(){a(this).remove()})}),a(document).keydown(function(b){return 27==b.keyCode?(a(".sp-lightbox").fadeOut(function(){a(this).remove()}),!1):void 0}),a(".sp-large").mousemove(function(b){var c=a(this).width(),d=a(this).height(),e=a(this).find(".sp-zoom").width(),f=a(this).find(".sp-zoom").height(),g=a(this).parent().offset(),h=b.pageX-g.left,i=b.pageY-g.top,j=Math.floor(h*(c-e)/c),k=Math.floor(i*(d-f)/d);a(this).find(".sp-zoom").css({left:j,top:k})}).mouseout(function(){}),a.fn.draggable=function(){var b=null,c=function(c){var d=c.originalEvent,e=a(this).position();b={x:d.changedTouches[0].pageX-e.left,y:d.changedTouches[0].pageY-e.top}},d=function(c){c.preventDefault();var d=c.originalEvent,e=d.changedTouches[0].pageY-b.y,f=d.changedTouches[0].pageX-b.x,g=-1*(a(".sp-zoom").height()-a(".sp-large").height()),h=-1*(a(".sp-zoom").width()-a(".sp-large").width());e>g&&0>e&&a(this).css({top:e}),f>h&&0>f&&a(this).css({left:f})};this.bind("touchstart",c),this.bind("touchmove",d)},a(document.body).on("click",".sp-zoom",function(){a(this).parent().parent().find(".sp-full-screen").fadeOut(function(){a(this).remove()}),a(this).fadeOut(function(){a(this).remove()})})}})}(jQuery);Reicht das so?
Danke euch!
Gruss,
swissPHP
