|
كود تقليب الصور سلام عليكم الكود عباره عن جافا سكربت وcss مواصفات الكود انه لم تكبس على صوره في بدايه الموضوع يقلبلك الصور اللي في كل الردود ايظا بمكان واحد تبرز واجهه وتكبس بالماوس وهو بيقلب الصور مع تاثير جميل كما في منتداي الان شرح التركيب اولا كود جافا سكربت تضعه في خانه الجافا في منتداك كود بلغة HTML: jQuery(function(){(function(a){a.fn.lightBox=function(p){p=jQuery.extend({overlayBgColor:"#000",overlayOpacity:0.8,fixedNavigation:false,imageLoading:"https://i.servimg.com/u/f14/14/83/59/48/wsnrjt11.gif",imageBtnPrev:"https://i.servimg.com/u/f14/14/83/59/48/backwa11.png",imageBtnNext:"https://i.servimg.com/u/f14/14/83/59/48/forwa111.png",imageBtnClose:"https://i.servimg.com/u/f14/14/83/59/48/closew11.png",imageBlank:"//https://i.servimg.com/u/f14/14/83/59/48/1e1fex12.gif",containerBorderSize:10,containerResizeSpeed:400,txtImage:"Image",txtOf:"sur",keyToClose:"c",keyToPrev:"p",keyToNext:"n",imageArray:[],activeImage:0},p);var i=this;function r(){o(this,i);return false}function o(v,u){a("embed, object, select").css({visibility:"hidden"});c();p.imageArray.length=0;p.activeImage=0;if(u.length==1){p.imageArray.push(new Array(v.getAttribute("href"),v.getAttribute("title")))}else{for(var t=0;t<u.length;t++){p.imageArray.push(new Array(u[t].getAttribute("href"),u[t].getAttribute("title")))}}while(p.imageArray[p.activeImage][0]!=v.getAttribute("href")){p.activeImage++}l()}function c(){a("body").append('<div id="jquery-overlay"></div><div id="jquery-lightbox"><div id="lightbox-container-image-box"><div id="lightbox-container-image"><img id="lightbox-image"><div style="" id="lightbox-nav"><a href="#" id="lightbox-nav-btnPrev"></a><a href="#" id="lightbox-nav-btnNext"></a></div><div id="lightbox-loading"><a href="#" id="lightbox-loading-link"><img src="'+p.imageLoading+'"></a></div></div></div><div id="lightbox-container-image-data-box"><div id="lightbox-container-image-data"><div id="lightbox-image-details"><span id="lightbox-image-details-caption"></span><span id="lightbox-image-details-currentNumber"></span></div><div id="lightbox-secNav"><a href="#" id="lightbox-secNav-btnClose"><img src="'+p.imageBtnClose+'"></a></div></div></div></div>');var t=f();a("#jquery-overlay").css({backgroundColor:p.overlayBgColor,opacity:p.overlayOpacity,width:t[0],height:t[1]}).fadeIn();var u=h();a("#jquery-lightbox").css({top:u[1]+(t[3]/10),left:u[0]}).show();a("#jquery-overlay,#jquery-lightbox").click(function(){b()});a("#lightbox-loading-link,#lightbox-secNav-btnClose").click(function(){b();return false});a(window).resize(function(){var v=f();a("#jquery-overlay").css({width:v[0],height:v[1]});var w=h();a("#jquery-lightbox").css({top:w[1]+(v[3]/10),left:w[0]})})}function l(){a("#lightbox-loading").show();if(p.fixedNavigation){a("#lightbox-image,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber").hide()}else{a("#lightbox-image,#lightbox-nav,#lightbox-nav-btnPrev,#lightbox-nav-btnNext,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber").hide()}var t=new Image();t.onload=function(){a("#lightbox-image").attr("src",p.imageArray[p.activeImage][0]);j(t.width,t.height);t.onload=function(){}};t.src=p.imageArray[p.activeImage][0]}function j(w,z){var t=a("#lightbox-container-image-box").width();var y=a("#lightbox-container-image-box").height();var x=(w+(p.containerBorderSize*2));var v=(z+(p.containerBorderSize*2));var u=t-x;var A=y-v;a("#lightbox-container-image-box").animate({width:x,height:v},p.containerResizeSpeed,function(){g()});if((u==0)&&(A==0)){if(a.browser.msie){n(250)}else{n(100)}}a("#lightbox-container-image-data-box").css({width:w});a("#lightbox-nav-btnPrev,#lightbox-nav-btnNext").css({height:z+(p.containerBorderSize*2)})}function g(){a("#lightbox-loading").hide();a("#lightbox-image").fadeIn(function(){k();s()});q()}function k(){a("#lightbox-container-image-data-box").slideDown("fast");a("#lightbox-image-details-caption").hide();if(p.imageArray[p.activeImage][1]){a("#lightbox-image-details-caption").html(p.imageArray[p.activeImage][1]).show()}if(p.imageArray.length>1){a("#lightbox-image-details-currentNumber").html(p.txtImage+" "+(p.activeImage+1)+" "+p.txtOf+" "+p.imageArray.length).show()}}function s(){a("#lightbox-nav").show();a("#lightbox-nav-btnPrev,#lightbox-nav-btnNext").css({background:"transparent url("+p.imageBlank+") no-repeat"});if(p.activeImage!=0){if(p.fixedNavigation){a("#lightbox-nav-btnPrev").css({background:"url("+p.imageBtnPrev+") left 15% no-repeat"}).unbind().bind("click",function(){p.activeImage=p.activeImage-1;l();return false})}else{a("#lightbox-nav-btnPrev").unbind().hover(function(){a(this).css({background:"url("+p.imageBtnPrev+") left 15% no-repeat"})},function(){a(this).css({background:"transparent url("+p.imageBlank+") no-repeat"})}).show().bind("click",function(){p.activeImage=p.activeImage-1;l();return false})}}if(p.activeImage!=(p.imageArray.length-1)){if(p.fixedNavigation){a("#lightbox-nav-btnNext").css({background:"url("+p.imageBtnNext+") right 15% no-repeat"}).unbind().bind("click",function(){p.activeImage=p.activeImage+1;l();return false})}else{a("#lightbox-nav-btnNext").unbind().hover(function(){a(this).css({background:"url("+p.imageBtnNext+") right 15% no-repeat"})},function(){a(this).css({background:"transparent url("+p.imageBlank+") no-repeat"})}).show().bind("click",function(){p.activeImage=p.activeImage+1;l();return false})}}m()}function m(){a(document).keydown(function(t){d(t)})}function e(){a(document).unbind()}function d(t){if(t==null){keycode=event.keyCode;escapeKey=27}else{keycode=t.keyCode;escapeKey=t.DOM_VK_ESCAPE}key=String.fromCharCode(keycode).toLowerCase();if((key==p.keyToClose)||(key=="x")||(keycode==escapeKey)){b()}if((key==p.keyToPrev)||(keycode==37)){if(p.activeImage!=0){p.activeImage=p.activeImage-1;l();e()}}if((key==p.keyToNext)||(keycode==39)){if(p.activeImage!=(p.imageArray.length-1)){p.activeImage=p.activeImage+1;l();e()}}}function q(){if((p.imageArray.length-1)>p.activeImage){objNext=new Image();objNext.src=p.imageArray[p.activeImage+1][0]}if(p.activeImage>0){objPrev=new Image();objPrev.src=p.imageArray[p.activeImage-1][0]}}function b(){a("#jquery-lightbox").remove();a("#jquery-overlay").fadeOut(function(){a("#jquery-overlay").remove()});a("embed, object, select").css({visibility:"visible"})}function f(){var v,t;if(window.innerHeight&&window.scrollMaxY){v=window.innerWidth+window.scrollMaxX;t=window.innerHeight+window.scrollMaxY}else{if(document.body.scrollHeight>document.body.offsetHeight){v=document.body.scrollWidth;t=document.body.scrollHeight}else{v=document.body.offsetWidth;t=document.body.offsetHeight}}var u,w;if(self.innerHeight){if(document.documentElement.clientWidth){u=document.documentElement.clientWidth}else{u=self.innerWidth}w=self.innerHeight}else{if(document.documentElement&&document.documentElement.clientHeight){u=document.documentElement.clientWidth;w=document.documentElement.clientHeight}else{if(document.body){u=document.body.clientWidth;w=document.body.clientHeight}}}if(t<w){pageHeight=w}else{pageHeight=t}if(v<u){pageWidth=v}else{pageWidth=u}arrayPageSize=new Array(pageWidth,pageHeight,u,w);return arrayPageSize}function h(){var u,t;if(self.pageYOffset){t=self.pageYOffset;u=self.pageXOffset}else{if(document.documentElement&&document.documentElement.scrollTop){t=document.documentElement.scrollTop;u=document.documentElement.scrollLeft}else{if(document.body){t=document.body.scrollTop;u=document.body.scrollLeft}}}arrayPageScroll=new Array(u,t);return arrayPageScroll}function n(v){var u=new Date();t=null;do{var t=new Date()}while(t-u<v)}return this.unbind("click").click(r)};a(function(){a("div.postbody img[src]").not(a(".postbody .signature_div img,.postbody .topic-title img,.postbody .profile-icons img,.postbody p.author img,.postbody .postprofile img, .postbody .postdetails img ,div.postbody a img[src],div.postbody img[src][longdesc]")).each(function(){a(this).wrap("<a />").parent().attr("href",a(this).attr("src"))}).parent().lightBox()})})(jQuery)}); |
رد: كود تقليب الصور الان كود css عملت الموضوع في اثنين حتا لاتتلخبط الاكواد كود: |
رد: كود تقليب الصور في اي قالب يوضع ؟؟ |
رد: كود تقليب الصور كود الجافا يوضع بقوالب الجافا سكربت اما كود css فيوضع في اكواد كي اس اس التي تتضمن الاكواد العامه للمنتدى |
رد: كود تقليب الصور شوفي في لوحه التحكم ايها اكواد الجافا اللي تخص المواضيع او المنتدى نفسه وضعي الكود في خانته |
رد: كود تقليب الصور سؤال هل عندك منتدى تجريبي نقيم عليه الاختبارات اتمنى يكون عندك وتقدري تعطيني فيه صفه اداره حتا اقوم بالتطويرات عليه |
رد: كود تقليب الصور اقتباس:
اضفته فيcss ولم يتم التغير |
رد: كود تقليب الصور اقتباس:
لا ما عندي |
رد: كود تقليب الصور وكود الجافا وضعتيه ولا لا |
رد: كود تقليب الصور لا لاني مو عارفه الطريقه لو في شرح مفصل يكون افضل ويعطيك العافيه |
رد: كود تقليب الصور الله يعافيكي كود الجافا لازم يتوضع مكانه وادا ما وضعتيه ما يضهر اي شي ححاول ادور الطريقه وابلغك |
رد: كود تقليب الصور تلاقين مكان في مربع وضع الاكواد في اللوحه التي تخص اكواد الموضوع اكيد حتلاقين مكان فيه احتمال مافي خانه للاكواد الجافه ربما تجديها في مكان اخر قومي بالبحث في الخانات |
رد: كود تقليب الصور تابعي هدا الفيديو [فقط الأعضاء المسجلين يمكنهم مشاهدة الروابط. إضغط هنا للتسجيل...] |
رد: كود تقليب الصور شوفي الفيجوال بيسك حاولي تعملي مكان جديد للكود وتسميه باسم الدي تريديه وبعدها ضعي الكود |
رد: كود تقليب الصور اقتباس:
يعني من لوحة التحكم وبعدين خيارات المنتدى؟؟؟؟ مثلا والا؟؟؟ |
رد: كود تقليب الصور اقتباس:
للاسف الشرح غير واضح ممكن تعطيني رابط مباشر للكود حتى اشوف كيف ظاهره الصور وطريقة تقلبها |
رد: كود تقليب الصور هدا موضوع من منتداي مباشر للموضوع اضغطي على اول صوره بالاعلى واستمري بالضغط عليها لتتالي الصور [فقط الأعضاء المسجلين يمكنهم مشاهدة الروابط. إضغط هنا للتسجيل...] |
رد: كود تقليب الصور انا في البدايه هم كنت مثلك اهتم بتصاميم الستايل فقط وما اهتم لجمال المواضيع لاكن بالفتره الاخيره شفت ان جمال الموضوع لا يقل اهميه عن جمال الستايل فلازم نضع مؤثرات وشغلات لجمال الموضوع |
رد: كود تقليب الصور صدقت وان شاء الله بما لديكم من معرفه في هذا المجال سوف نكون متابعين لمواضيعك ونطبقها على حسب معرفتنا واستطاعتنا المهم شرحك يتظمن شرح مفصل مع اضافة الصور ويعطيك العافية |
| الساعة الآن 02:11 AM. |
Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2025, vBulletin Solutions, Inc.