قائمة جانبية متحركة

[عميروش]

السلام عليكم و رحمة الله و بركاته

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

دائما ما نرى في المواقع ذات العرض المحدد مساحة فارغة عن اليمين و اليسار

هذا الكود مناسب جدا لمن يريد استغلال هذه المساحة :)

بعد وضع الكود ستتمكن سواءا من وضع قائمة تصفح أو روابط مهمة للزائر

أو يمكنك إستعمالها كمساحة إعلانية إضافية

و أحسن شيئ أن القائمة تطفو يعني متحركة و تتبع الزائر في حالة التحرك لأعلى أو لأسقل الصفحة

يعني القائمة تبقى في المنطقة المرئية للزائر و هذا ما يزيد أهميتها

و أيضا تستطيع جعل القائمة تطفو من الأعلى الى الأسفل أو من الأسفل الى الأعلى :D

و ذلك من خلال تغييرfrombottom أو fromtop

و أخيرا تستطيع التحكم أيضا في لون الجدول

هذه هو الكود


<script>
if (!document.layers)
document.write('<div id="divStayTopLeft" style="position:absolute">')
</script>

<layer id="divStayTopLeft">

<!--EDIT BELOW CODE TO YOUR OWN MENU-->
<table border="1" width="130" cellspacing="0" cellpadding="0">
<tr>
<td width="100%" bgcolor="#FFFFCC">
<p align="center"><b><font size="4">Menu</font></b></td>
</tr>
<tr>
<td width="100%" bgcolor="#FFFFFF">
<p align="left"> <a href="الرابط0">titre de la page</a><br>
<a href="الرابط رقم 1">titre de la page</a><br>
<a href="الرابط رقم 2">titre de la page</a><br>
<a href="الرابط رقم3">titre de la page</a><br>
<a href="الرابط رقم 4">titre de la page</a></td>
</tr>
</table>
<!--END OF EDIT-->

</layer>


<script type="text/javascript">

/*
Floating Menu script- Roy Whittle (http://www.javascript-fx.com/)
Script featured on/available at http://www.dynamicdrive.com/
This notice must stay intact for use
*/

//Enter "frombottom" or "fromtop"
var verticalpos="frombottom"

if (!document.layers)
document.write('</div>')

function JSFX_FloatTopDiv()
{
var startX = 3,
startY = 150;
var ns = (navigator.appName.indexOf("Netscape") != -1);
var d = document;
function ml(id)
{
var el=d.getElementById?d.getElementById(id):d.all?d.a ll[id]:d.layers[id];
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x;this.style.t op=y;};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
el.y -= startY;
}
return el;
}
********stayTopLeft=function()
{
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : document.body.scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("divStayTopLeft");
stayTopLeft();
}
JSFX_FloatTopDiv();
</script>

مثال للقائمة مع روابط

http://i43.servimg.com/u/f43/11/63/19/85/side_l10.png

مثال للقائمة مع بانرات إعلانية

http://i43.servimg.com/u/f43/11/63/19/85/side_b10.png

[الأخ ياسين]

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

[عميروش]

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

هذا الكود يلبي حاجتك أخي الكريم

القائمة ستنزل أسفل الصفحة أو ترتفع حسب المتصفح

يعني تتبع تحركات الزائر :o

[الأخ ياسين]

نعم أخي واضن أنها بالجافا سكريبت و انا أريد واحدة

[الأخ ياسين]

لا أخي لم تتحرك

[الأستاذ سامي]

السلام عليكم و رحمة الله و بركاته
اخي عميروش موضوع مفيد
و ان كنت شخصيا لا احب اثقال موقعي بالجافا سكربت ان كانت غير ضرورية

بارك الله فيك

[عميروش]

لا أخي لم تتحرك

زر الموقع الموجود في توقيعي

لرؤيت مثال حي للقائمة الجانبية المتحركة و جربها بنفسك :o

أيضا


شكرا للأستاذ سامي على المرور العطر

[الأخ ياسين]

حقا قد زرت الموقع و رأيت ذلك لكنهنا تخفي جزء من الموقع أخي
************************************************** ***********************
وانا سجلت في الموقع قصد الربح منه كما كتبت في التوقيع و لم أفهم شيء
************************************************** ****************************