دليل ومكتبة الويب العربي - ويب 2.0 وأكواد متنوعة - كلمة ترحيب تتبع الماوس بطريقة جميلة

تسجيل دخول

ملاحظة

الموقع متاح للإطلاع والقراءة فقط، المشاركة والمواضيع الجديدة غير متاحة حالياً لحين تطوير الموقع.

الموقع متاح للإطلاع والقراءة فقط، المشاركة والمواضيع الجديدة غير متاحة حالياً لحين تطوير الموقع.

		الويب العربي دليل ومكتبة الويب العربي مكتبة الويب العربي ويب 2.0 وأكواد متنوعة
كلمة ترحيب تتبع الماوس بطريقة جميلة

الأقسام

إستعراض

بحث

ويب 2.0 وأكواد متنوعة

ويب 2.0 وأكواد وأدوات متنوعة لتطوير المواقع
Ajax , XML , CSS , JavaScript ...etc

تبادل خبرات البرمجة

المحتويات

كلمة ترحيب تتبع الماوس بطريقة جميلة

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

مثال :

تظهر الكلمة كما بالصورة

التركيب :

ضع هذا الكود بمنطقة الـ head بصفحتك

كود:

<style>
.spanstyle {
	position:absolute;
	visibility:visible;
	top:-50px;
	font-size:12pt;
	font-family:Arial;
	font-weight:bold;
}
</style>
<script>


// Your trailing message.
var message="العربى الويب فى بكم مرحبا  "
message=message.split(" ")


var step=8 
var stepbasic=8

// Do not edit the varianles below
var x,y
var flag=0
var xpos=new Array()
for (i=0;i<=message.length-1;i++) {
	xpos[i]=-100
}

var ypos=new Array()
for (i=0;i<=message.length-1;i++) {
	ypos[i]=-100
}

var spacebetweenwords=new Array()
for (i=0;i<=message.length-1;i++) {
	spacebetweenwords[i]=stepbasic+step*message[i].length-1
}

var colorstep=Math.round(255/message.length-1)

var colorrgb=new Array()
for (i=0;i<=message.length-1;i++) {
	colorrgb[i]=i*colorstep
}

var wordcolor=new Array()
for (i=0;i<=message.length-1;i++) {
    var colhex_left = Math.floor(colorrgb[i]/16)
    var colhex_right= colorrgb[i]-(colhex_left*16)
    if (colhex_left == 10) {colhex_left="A"}
    if (colhex_left == 11) {colhex_left="B"}
    if (colhex_left == 12) {colhex_left="C"}
    if (colhex_left == 13) {colhex_left="D"}
    if (colhex_left == 14) {colhex_left="E"}
    if (colhex_left == 15) {colhex_left="F"}  
    if (colhex_right == 10) {colhex_right="A"}
    if (colhex_right == 11) {colhex_right="B"}
    if (colhex_right == 12) {colhex_right="C"}
    if (colhex_right == 13) {colhex_right="D"}
    if (colhex_right == 14) {colhex_right="E"}
    if (colhex_right == 15) {colhex_right="F"}    
    wordcolor[i] =""+colhex_left+colhex_right
}

function handlerMM(e){
	x = (dcidocument.layers) ? e.pageX : dcidocument.body.scrollLeft+event.clientX
	y = (dcidocument.layers) ? e.pageY : dcidocument.body.scrollTop+event.clientY
	flag=1
}

function makesnake() {
	if (flag==1 && dcidocument.all) {
    	for (i=message.length-1; i>=1; i--) {
   			xpos[i]=xpos[i-1]+spacebetweenwords[i-1]
			ypos[i]=ypos[i-1]
    	}
		xpos[0]=x+stepbasic
		ypos[0]=y
	
		for (i=0; i<message.length-1; i++) {
    		var thisspan = eval("span"+(i)+".style")
    		thisspan.posLeft=xpos[i]
			thisspan.posTop=ypos[i]
    	}
	}
	
	else if (flag==1 && dcidocument.layers) {
    	for (i=message.length-1; i>=1; i--) {
   			xpos[i]=xpos[i-1]+spacebetweenwords[i-1]
			ypos[i]=ypos[i-1]
    	}
		xpos[0]=x+stepbasic
		ypos[0]=y
	
		for (i=0; i<message.length-1; i++) {
    		var thisspan = eval("dcidocument.span"+i)
    		thisspan.left=xpos[i]
			thisspan.top=ypos[i]
    	}
	}
		var timer=setTimeout("makesnake()",30)
}

</script>

2-- ضع هذا الكود فى منطقة ال body ومستبدلا به وسم الـ <body>

كود:

<body onLoad="makesnake()" style="width:100%;overflow-x:hidden;overflow-y:scroll"   bgcolor=#FF66FF>

<script>


for (i=0;i<=message.length-1;i++) {
    dcidocument.write("<span id='span"+i+"' class='spanstyle'>")
	dcidocument.write("<font color='"+wordcolor[i]+wordcolor[i]+wordcolor[i]+"'>"+message[i]+"</font>")
    dcidocument.write("</span>")
}

if (dcidocument.layers){
	dcidocument.captureEvents(Event.MOUSEMOVE);
}
dcidocument.onmousemove = handlerMM;

// - End of JavaScript - -->
</script>


<DIV id="deletethisblock" style="position:absolute;top:20px;left:20px;">
<font size=1 face=Verdana>
<ul>

</body>

أطيب تحية

قسم : ويب 2.0 وأكواد متنوعة

بواسطة : محمّد نور

03-01-2008
الزيارات 40
30.60 كيلو بايت

قسم :

إنتقل إلى