منتديات الشارف
أهلا وسهلا بك زائرنا الكريم، إذا كانت هذه زيارتك الأولى للمنتدى، فيرجى
التكرم بالتسجيل في المنتدى للتسجيل يرجى ان تضغط على زر التسجيل إذا
رغبت بالمشاركة في المنتدى، أما إذا رغبت بقراءة المواضيع والإطلاع فتفضل
بزيارة القسم الذي ترغب أدناه
تحياتي ادآرة المنتدى



أهلا وسهلا بك عزيزي الزائر في الشــارف
أهلا وسهلا بكم في منتديات الشـــارف


الرئيسيةمكتبة الصورس .و .جبحـثالتسجيلدخول
خط خارجي - فور ألجيريا
آخر المواضيع المضافة في منتـديات الشـارف
آخر المواضيع
شارك اصدقائك شارك اصدقائك اطلب تصميمك مجاناً معنا
شارك اصدقائك شارك اصدقائك اطلب ايقونات , رمزيات, صور . اى شئ مع الابداع العربي
شارك اصدقائك شارك اصدقائك الى يطو عبدالرحمن ضرووووري
شارك اصدقائك شارك اصدقائك الى يطو عبد الرحمان الجلفة هع
شارك اصدقائك شارك اصدقائك [charef] Black Cat
شارك اصدقائك شارك اصدقائك وَجَعَلْنَا مِنَ الْمَاءِ كُلَّ شَيْءٍ حَيٍّ
شارك اصدقائك شارك اصدقائك التصوير القرآني لأضرار الصعود في الفضاء charef
شارك اصدقائك شارك اصدقائك قصة رسول الله صلى الله عليه وسلم مع جار ه اليهودي charef
شارك اصدقائك شارك اصدقائك في الدقيقة الواحدة*أخي المسلم charef
شارك اصدقائك شارك اصدقائك معلومات و حقائق غريبة
الأربعاء 18 مارس 2015, 08:13
الجمعة 13 مارس 2015, 11:15
السبت 27 ديسمبر 2014, 00:57
السبت 27 ديسمبر 2014, 00:55
السبت 06 سبتمبر 2014, 14:51
الأربعاء 23 يوليو 2014, 11:46
الأربعاء 23 يوليو 2014, 11:42
الأربعاء 23 يوليو 2014, 07:06
الأربعاء 23 يوليو 2014, 07:05
الأربعاء 23 يوليو 2014, 07:03
أضغط على و للمشاركة مع أصدقاءك !

منتديات الشارف :: تطوير المواقع والمنتديات :: اكواد javascript و jQuery

شاطر

السبت 05 يوليو 2014, 09:03
المشاركة رقم:
بيـانات الكـاتب
الكاتب:
اللقب:
مشرف تطوير المواقع والمنتديات
الرتبه:
الصورة الرمزية


البيانات
انثى
عدد المساهمات : 153
التوقيت

الإتصالات
الحالة:
وسائل الإتصال:

مُساهمةموضوع: حصريا اضافة زر في صندوق ماسي لتغيير خلفية تلقائيا




حصريا اضافة زر في صندوق ماسي لتغيير خلفية تلقائيا







الكود عبارة عن زر يظهر في ازرار حقل كتابة مواضيع وردود لوضع خلفية تختارها انت لي تظهر خلفية لموضوعك او ردك الزر يحتوي على العديد من خلفيات كل ما عليك ضغط عليها وتكرار ويتتغير خلفية وتظهر تلقائيا للمعاينة في حق كتابة

مثال في صورة

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

صورة لعمل الكود

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]


==== طريقة التركيب سهلة جدا ======

نتوجه الى
لوحة ادارة >> مظهر المنتدى >> الوان >> ورقة تصميم css >> تم نضع الكود التالي



الكود:
div.sceditor-container iframe, div.sceditor-container textarea {  background: transparent;}.postbg {  background-position: 0 0; background-repeat: repeat;

م نتوجه الى
لوحة ادارة >> عناصر إضافية >>إدارة اكواد Javascript >> تم نضغ الكود التالي


الكود:
 $(function() { $("div.postbody").each(function() { var n = this; if($(".post-entry", n).length) { n = $(".post-entry", n)[0] }else { if($(".content", n).length) { n = $(".content", n)[0] } } while(n.nodeType != 3 && n.hasChildNodes()) { n = n.childNodes[0] } if(n.nodeType != 3) { return val } if(n.nodeValue.substr(0, 8) != "[postbg=") { return val } var m = n.nodeValue.match(/^\[postbg=([^\[]*)\]/); $(this).closest("div.post-container,div.post,td.row1,td.row2,div.postmain").addClass("postbg").css("background-image", "url(" + m[1] + ")"); n.nodeValue = n.nodeValue.replace(/^\[postbg=[^\[]*\]\n?/, ""); if(!n.nodeValue && n.nextSibling.nodeType == 1 &&n.nextSibling.tagName == "BR") { $(n.nextSibling).remove() } }); if($("#text_editor_textarea").length && $.sceditor) { var bglist ="http://i.imgur.com/20aRJFn.png,http://i.imgur.com/DcTM2Ng.jpg,http://i.imgur.com/tkC3deY.jpg,http://i.imgur.com/pfTcnqF.png,http://i.imgur.com/dAQtdaR.gif,http://i.imgur.com/48CU2Qx.png,http://i.imgur.com/lRuwoVi.png,http://i.imgur.com/EHp45H1.png,http://i.imgur.com/8bhbqFF.png,http://i.imgur.com/tb80sYG.png,http://i.imgur.com/6LPhzcp.png,http://i.imgur.com/DkRuYf1.png,http://i.imgur.com/57F0z86.jpg,http://i.imgur.com/PZyMuXF.png".split(","); var bgnum = -1; var val = $("#text_editor_textarea").val(); if(val.substr(0, 8) == "[postbg=") { var m = val.match(/^\[postbg=([^\[]*)\]/); if(m) { var r = $.inArray(m[1], bglist); if(r != -1) { bgnum = r }else { bgnum = bglist.length - 1 } $(function() { $(".sceditor-container").css("background-position", "0 " +($(".sceditor-toolbar").height() + 6) + "px"); $(".sceditor-container").css("background-image", "url(" +m[1] + ")") }); $("#text_editor_textarea").val(val.replace(/^\[postbg=[^\[]*\]/, "")) } } $(function() { if(!$("#text_editor_textarea").sceditor("instance")) { return } $('<a class="sceditor-button" unselectable="on" title="Fond de message"><div unselectable="on" style="background:url(http://i.imgur.com/Hrf5w1i.gif);opacity:1">Fond de message</div></a>').insertAfter(".sceditor-button-fahide").click(function(e) { if(e.ctrlKey) { $(".sceditor-container").css("background-image", ""); bgnum = -1 }else { bgnum++; if(!bgnum) { $(".sceditor-container").css("background-position", "0 "+ ($(".sceditor-toolbar").height() + 6) + "px") } $(".sceditor-container").css("background-image", "url(" +bglist[bgnum % bglist.length] + ")") } }) }); $(function() { $('form[name="post"]').submit(function() { if(bgnum != -1) { $("#text_editor_textarea").val(function(i, val) { return"[postbg=" + bglist[bgnum % bglist.length] + "]" +val }) } }) }) }});


كدى الكود صار شغال ونتمنى ان يكون الكود قد نال اعجابكم

اما لمن يريد اضافة خلفيات خاصة به لتعمل على صندوق ايضا
يقوم باخد رابط صورة وضمها الى مجموعة الصور الموجودة في الكود والتي هي مع عدم نسيان الفاصلة بين روابط الخلفيات (,)



الكود:
http://i.imgur.com/20aRJFn.png,http://i.imgur.com/DcTM2Ng.jpg,http://i.imgur.com/tkC3deY.jpg,http://i.imgur.com/pfTcnqF.png,http://i.imgur.com/dAQtdaR.gif,http://i.imgur.com/48CU2Qx.png,http://i.imgur.com/lRuwoVi.png,http://i.imgur.com/EHp45H1.png,http://i.imgur.com/8bhbqFF.png,http://i.imgur.com/tb80sYG.png,http://i.imgur.com/6LPhzcp.png,http://i.imgur.com/DkRuYf1.png,http://i.imgur.com/57F0z86.jpg,http://i.imgur.com/PZyMuXF.png














الموضوع   الأصلي : حصريا اضافة زر في صندوق ماسي لتغيير خلفية تلقائيا المصدر : منتديات الشــارف الكاتب:دينا حسني



توقيع : دينا حسني








الإشارات المرجعية


  


..









تعليمات المشاركة
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى

BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة



الساعة الآن



جميع الحقوق محفوظة لمنتـديات الشــارف © 2014
تحويل وتطوير : Aymen-Mans