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

اذهب الى الأسفل

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

مُساهمة من طرف ◄NEXT في الأربعاء 31 أكتوبر 2012 - 3:10

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

مميزاته :

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

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

Invision,phpBB3,phpBB2,PunBB

تم تجربة الكود


للمعاينة








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


لا تنسا ان تضغط علامة صح على "المواضيع" في صفحة الجافا سكربت
الخطوى الأولى

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

[center]كود النسخة الـ 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%'})})}})});
[color=#000000]



[center]
كود النسخة الـ 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%'})})}})});
[color=#000000]




[center]
كود النسخة الـ 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

[center]


الكود:





.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;
}[/center]









المصدر:موقع عرب سوفت التطويري

http://arab.umbb.net

[/color][/center][/color][/center]
[/center][/center]

◄NEXT
 
 

ذكر
عدد المساهمات : 261
معدل النشاط : 2404
السُمعة : 3

http://arab-top.forum.st

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: خاصية مشاهدة باقي الموضوع و وضعها بشكل زر

مُساهمة من طرف ◄NEXT في الأربعاء 31 أكتوبر 2012 - 3:11

ارجو نقل الكود في مكانة الصحيح

مع الشكر

◄NEXT
 
 

ذكر
عدد المساهمات : 261
معدل النشاط : 2404
السُمعة : 3

http://arab-top.forum.st

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: خاصية مشاهدة باقي الموضوع و وضعها بشكل زر

مُساهمة من طرف ◄NEXT في الأربعاء 31 أكتوبر 2012 - 12:39

ما في ردود

◄NEXT
 
 

ذكر
عدد المساهمات : 261
معدل النشاط : 2404
السُمعة : 3

http://arab-top.forum.st

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: خاصية مشاهدة باقي الموضوع و وضعها بشكل زر

مُساهمة من طرف زيزو اليكس في الأربعاء 31 أكتوبر 2012 - 12:45

يمنع وضع اى كود اوشرح على العام يجب ان يعرض على الاداره اولا

ضع الكود فى قسم الشكايات العامة

silent
avatar
زيزو اليكس
 
 

ذكر
عدد المساهمات : 12788
معدل النشاط : 15531
السُمعة : 427

http://zezoalex-14.hooxs.com/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

الرجوع الى أعلى الصفحة


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