كود [Javascript] يقوم بوضع خاصية مشاهدة باقي الموضوع

كود Javascript مميز يقوم بوضع خاصية مشاهدة باقي الموضوع و وضعها بشكل زر و بتقنية جميلة جدا

مميزاته :
فكرة الكود قامت بعد ما أعجبتني فكرة في منتدى 
و الحمد لله فأنا قمت ببرمجة كود الجافا كاملا التابع لكود الجافا سكربت

الكود يعمل على النسخ التالية فقط

Invision,phpBB3,phpBB2,PunBB

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

شرح تركيب الكود :

الخطوى الأولى

لوحة الإدارة >> عناصر اضافية >> HTML و JAVASCRIPT >> إدارة أكواد Javascript

تنوية:-تفضل مشكورآ بوضع ردآ ليظهر لك بقية الموضوع والشرح

كود النسخة الـ phpBB2

الكود:

    var CopyrightNotice = 'See More Topic for Ahlamontada
    phpBB2
    boards. Copyright © 2012 by Sam Hameed & GatexTeem. All Rights
    Reserved. Use and/or modification of this script is allowed, provided
    this entire copyright notice remains in the original
    or modified script.';
    $(function(){
    $("div.postbody div:not('.cont_code')").each(function(){var $baivietdai=$(this);
    if($(this).height()>500){
    $(this).css({'overflow':'hidden','max-height':'300px'});
    $('<br/><div
    style="text-align: center;"><button style="float:center;
    padding:1px" class="See-More-By-Sam">أضغط هنا لمشاهدة باقي
    الموضوع</button></div>').insertAfter(this);
    $('.See-More-By-Sam').click(function(){$baivietdai.css({'overflow':'hidden','max-height':'100%'});
    $(this).remove()})}});
    $('div.signature_div').each(function(){if(
    $(this).height()>350){
    $('div.signature_div img').css('max-width','600px');
    $(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'});
    $(this).hover(function(){
    $(this).css({'overflow':'hidden','max-height':'100%','max-width':'100%'})},function(){
    $(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'})})}})});


كود النسخة الـ phpBB3

الكود:



    var CopyrightNotice = 'See More Topic for Ahlamontada
     phpBB3 boards. Copyright © 2012 by Sam Hameed & GatexTeem. All
    Rights Reserved. Use and/or modification of this script is allowed,
    provided this entire copyright notice remains in the original
    or modified script.';
    $(function(){
    $("div.content").each(function(){
    var $baivietdai=$(this);
    if($(this).height()>500){
    $(this).css({'overflow':'hidden','max-height':'300px'});
    $('<br/><div
     style="text-align: center;"><button style="float:center;
    padding:1px" class="See-More-By-Sam">أضغط هنا لمشاهدة باقي
    الموضوع</button></div>').insertAfter(this);
    $('.See-More-By-Sam').click(function(){
    $baivietdai.css({'overflow':'hidden','max-height':'100%'});
    $(this).remove()})}});
    $('div.signature_div').each(function(){if(
    $(this).height()>350){
    $('div.signature_div img').css('max-width','600px');
    $(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'});
    $(this).hover(function(){
    $(this).css({'overflow':'hidden','max-height':'100%','max-width':'100%'})},function(){
    $(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'})})}})});



كود النسخة الـ Invision

   

الكود:

var CopyrightNotice = 'See More Topic for Ahlamontada
     Invision
     boards. Copyright © 2012 by Sam Hameed & GatexTeem. All Rights
    Reserved. Use and/or modification of this script is allowed, provided
    this entire copyright notice remains in the original
    or modified script.';
    $(function(){
    $("div.post-entry").each(function(){
    var $baivietdai=$(this);
    if($(this).height()>500){
    $(this).css({'overflow':'hidden','max-height':'300px'});
    $('<br/><div
     style="text-align: center;"><button style="float:center;
    padding:1px" class="See-More-By-Sam">أضغط هنا لمشاهدة باقي
    الموضوع</button></div>').insertAfter(this);
    $('.See-More-By-Sam').click(function(){$baivietdai.css({'overflow':'hidden','max-height':'100%'});
    $(this).remove()})}});
    $('div.signature_div').each(function(){if(
    $(this).height()>350){
    $('div.signature_div img').css('max-width','600px');
    $(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'});
    $(this).hover(function(){
    $(this).css({'overflow':'hidden','max-height':'100%','max-width':'100%'})},function(){
    $(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'})})}})});



كود النسخة الـ PunBB
   

الكود:

var CopyrightNotice = 'See More Topic for Ahlamontada PunBB boards. Copyright © 2012 by Sam Hameed & GatexTeem. All
    Rights Reserved. Use and/or modification of this script is allowed,
    provided this entire copyright notice remains in the original
    or modified script.';
    $(function(){
    $("div.entry-content").each(function(){
    var $baivietdai=$(this);
    if($(this).height()>500){
    $(this).css({'overflow':'hidden','max-height':'300px'});
    $('<br/><div
     style="text-align: center;"><button style="float:center;
    padding:1px" class="See-More-By-Sam">أضغط هنا لمشاهدة باقي
    الموضوع</button></div>').insertAfter(this);
    $('.See-More-By-Sam').click(function(){
    $baivietdai.css({'overflow':'hidden','max-height':'100%'});
    $(this).remove()})}});
    $('div.sig-content').each(function(){if(
    $(this).height()>350){$('div.signature_div img').css('max-width','600px');
    $(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'});
    $(this).hover(function(){
    $(this).css({'overflow':'hidden','max-height':'100%','max-width':'100%'})},function(){
    $(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'})})}})});




الخطوى الثانية

بعد أختيارك لكود نسخة منتداك عليك اختيار شكل ليناسب المنتدى
ما عليك سوى وضع الكود المرفق في الأسفل ما عليك سوى اتباع الخطوات

لوحة أدارة - مظهر المنتدى - ألوان - ورقة الانماط الانسيابية css

الكود:


    .See-More-By-Sam{
    background: url("http://i47.servimg.com/u/f47/17/07/42/77/white-10.png") repeat-x scroll left top #F2F2F2;
    border: 1px solid #CCCCCC;
    border-radius: 10px 10px 10px 10px;
    color: #000000;
    font-family: Tahoma;
    font-size: small;
    height: 30px;
    margin-top: 5px;
    text-align: center;
    text-shadow: 0 1px 0 #FFFFFF;
    }
    .See-More-By-Sam:hover {
    background-image: url("http://i47.servimg.com/u/f47/17/07/42/77/bt_g10.png");
    color: #666666;
    }





و إلى هنا اخوانيـ
..ينتهي موضوعنا لهذا اليوم ..
في أمل اللقاء بكمـ
.إن شاء الله في مواضيع جديدة ..
والسلام عليكم و رحمة الله ..