 |
السلام عليكم يا شباب
تكفون يا شباب
طلبي يمكن سهل عليكم بس هوه صعب كثير علي
ابغا زر لما اضغط عليه يخفي جزء معين من ديف او تيبل او سبان او اي شيء ولما اضغط عليه مره ثانيه يرجع يفتحها
بس طريقة الاختفاء والظهور تكون تدريجيه
يعني شكل جميل مو مفاجئ
لا تردوني الله يخليكم
الأمر مستعجل
سلام
اخي هذا مثال كامل
كود PHP:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>ghfhgfh</title>
</head>
<body>
<div style="height:50px;width:100px;background-color:red" onclick="clospan('e',200,10);">اضغط هنا</div>
<div id="e" style=" overflow:hidden;height:10px;background-color:gray">الطبقة</div>
<script type="text/javascript">
<!--
function clospan(e,maxsize,speed){
speed=speed||10;//تحديد السرعة
maxsize=maxsize||1000;//تحديد اقصى حجم
var $=document.getElementById(e);
var timer=window.setInterval(function(){
if(parseInt($.style.height)==maxsize){
window.clearInterval(timer);
}
else{
$.style.height=parseInt($.style.height)+1+'px';
}
},speed);
}
//-->
</script>
</body>
</html>
مشكور اخي الغالي ما قصرت
بس المشكله انه لما اضغط بتفتح الطبقة بس لم ارجع اضغط عليها ما بتسكر
وكمان مشكلة السرعة ما عم تتعدل ؟؟
شكرا يا غالي ماقصرت
تمـ التعديل ع كود almhajer ليكن حسب طلبك
كود PHP:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>ghfhgfh</title>
</head>
<body>
<div style="height:50px;width:100px;background-color:red" onclick="toggle('e',200,10);">اضغط هنا</div>
<div id="e" style="display:none;overflow:hidden;height:0px;background-color:gray">الطبقة</div>
<script type="text/javascript">
<!--
var step=2 // التحرك بالبكسل,
function clospan(e,maxsize,speed){
speed=speed||10;//تحديد السرعة
maxsize=maxsize||1000;//تحديد اقصى حجم
var $=document.getElementById(e);
var timer=window.setInterval(function(){
if(parseInt($.style.height)==maxsize){
if(parseInt($.style.height)<=step){$.style.display='none'}else{window.clearInterval(timer);}
}
else{
if(parseInt($.style.height)<=maxsize){
$.style.height=parseInt($.style.height)+step+'px';
}else{
$.style.height=parseInt($.style.height)-step+'px';}
}
},speed);
}
function toggle(e,maxsize,speed){
var $=document.getElementById(e);
if($.style.display=='none'){$.style.display='';clospan(e,maxsize,speed)}else{clospan(e,step,speed)}
}
//-->
</script>
</body>
</html>
__________________
Professional Java?Script Programmer and Web Developer
اخي الغالي ليوناردو دافينشي
ما قصرت
شكرا كثير
بس هناك مشكله بسيطه لو تقدر تسويها اكون الك ممنون
يا غالي
لما تضغط اول مره يظهر الشكل ولما تضغط عليه مره تانيه يختفي
بس لو جربت كمان تضغط مره ما رح يعمل شي وتضغط مره تانيه بعدها رح يفتح الشكل ويسكره تلقائي
وكمان بالنسبه للسرعه واقصى حجم ما يشتغلو معي
هل بالامكان التعديل يا شباب
شكرا الك يا غالي
التعديل الأخير تم بواسطة fares1 ; 22-03-2009 الساعة 12:39 PM
يمكنك ذلك باستخدام مكتبة jquery
بكل سهولة في سطرين فقط
لكن المشكلة في كبر حجم ملف الـ jqueryكود HTML:<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $('a#show').click(function(){ $('#text').toggle('slow'); }); }); </script> <a href="#" id="show">show/hide</a> <div id="text">any content</div>
وتبقي طريقة almhajer و ليناردوا هي الاخف والافضل لكنها طويلة بعض الشئ
__________________
تحاور مع العاقل بعقل .. اما ان يقتنع او تقتنع
وتحاور مع الجاهل بعقل .. اما يطقعش او تفرقش
وتلك الفاظ لا معنى لها كذلك كلماته
شكرا جزيلا اخي سحاب اون لاين
هذا بالضبط ما ابحث عنه
لكن سؤالي
هل سوف يؤثر على اداء الموقع لو قمت باستخدام jquery مع كبر حجم الملف ؟؟؟
وهل لو وضغط داخل ما اعطيتني اياه قائمه فرعيه سوف تؤثر على عمله ؟
شكرا اخي سحاب اون لاين
مكتبة jquery من أذكي مكتبات الجافا سكربت
لا تخف .. ولكن قم بالتجربة وان شاء الله لن يحدث اي خلل
أما بخصوص كبر حجم ملف الـ jquery
المتصفح سيقوم بتحميله مرة واحدة فقط
__________________
تحاور مع العاقل بعقل .. اما ان يقتنع او تقتنع
وتحاور مع الجاهل بعقل .. اما يطقعش او تفرقش
وتلك الفاظ لا معنى لها كذلك كلماته
يعيطك العافية اخر ليناردو دافنشي
وصحيح كما ذكر الاخ سحاب اون لاين
تعبر اذكى المكتبات من حيث استغلال امكنية اللغة
وانا اعتمدت اببرمج الكود واوضح بنية العمل فقط للكود
حتى لايكون فقط عملية نسخ
بس مشاء الاخوة ماقصرو
بارك الله في الجميع ودمتم سالمين
يا جماعه انا كنت مفكر انه عملية الاظهار والاخفاء رح تحللي مشكلتي
ما شاء الله عليكم انتو ما قصرتو
بس لما رحت اكمل شغلي المطلوب مني
تفاجئت انه واجهني بعض المشاكل
فلو يا شباب لسه حابين تقدمو المساعد الله يخليكم
انا اضفت موضوع تاني عنوانه
طلب بسيط من الشباب الأكابر
يا ريت لو تقدرو تخدموني فيه
وشكرا الكم جميع
اخوي انا كنت محتاج دا الشيء قبل فترة
دورت وحصلت وحدة عدلت عليها لتناسب الويب 2
الطريقة
تنشئ ملف صيغته .js
وتحط بداخله هذا الكود
في الصفحة تضيف في الهيدركود:var ns6=document.getElementById&&!document.all?1:0 var head="display:''" var folder='' function expandit(curobj){ folder=ns6?curobj.nextSibling.nextSibling.style:document.all[curobj.sourceIndex+1].style if (folder.display=="none") folder.display="" else folder.display="none" }
<script type="text/javascript" src="****" ></script>
استبدل **** برابط ملف الـ js
--------------
النص او الصورة الي تبغى لمن يضغط المتصفح عليها تنفك القائمة
يعني اذا كان عبارة عن عنوانكود HTML:style="CURSOR: hand;" onclick="expandit(this)"
راح يكون زي كده
وال الجزء الي تبغا يختفي ويطلع اضيف لهكود HTML:<h2 style="CURSOR: hand;" onclick="expandit(this)">Jeddah</h2>
تحياتيكود HTML:style="DISPLAY: none;"
مشكور اخي الإعصار الأحمر
ما قصرت يعطيك العافيه يا رب
ضوابط المشاركة
رد مع اقتباس
