ممکن است شما در طراحی سایت خود نیاز به این داشته باشید که cursorموس خود را وقتی بر روی برخی قسمت ها قرار می گیرد در قالبی دیگر در طراحی وب سایت شما به نمایش گذاشته شود. امکان این ایفکت موجب زیباتر نمودن طراحی سایت شما و در عین حال موجب جلب نظر کاربر به آن بخش خاص از سایت خواهد شد. با طراحی سایت متناسب با نظر و توجه کاربر موجب افزایش ترافیک به سمت وب سایت خود خواهید شد که به موجب آن تاثیرگذاری مثبتی را در سئو سایت خود خواهید داشت. در اینجا اسکریپی که بدین منظور می بایست در طراحی وب سایت شما لحاظ شود را درج نموده ایم.
قطعه کد زیر را می بایست در قسمت تگ <head> وارد نمایید.
<STYLE TYPE="text/css">
<!--
BODY{
overflow-x:hidden;
}
.s1
{
position : absolute;
font-size : 10pt;
color : blue;
visibility: hidden;
}
.s2
{
position : absolute;
font-size : 18pt;
color : red;
visibility : hidden;
}
.s3
{
position : absolute;
font-size : 14pt;
color : gold;
visibility : hidden;
}
.s4
{
position : absolute;
font-size : 12pt;
color : lime;
visibility : hidden;
}
//-->
</STYLE>
و همچنین کد زیر را در قسمت تگ <BODY>صفحه سایت خود وارد نمایید.
<DIV ID="div1" CLASS="s1">*</DIV>
<DIV ID="div2" class="s2">*</DIV>
<DIV ID="div3" class="s3">*</DIV>
<DIV ID="div4" class="s4">*</DIV>
<p align="center"><font face="arial" size="-2">This free script provided by</font><br>
<font face="arial, helvetica" size="-2"><a href="http://j-avascriptkit.com">JavaScript
Kit</a></font></p>
<SCRIPT LANGUAGE="javascript" TYPE="text/j-avascript">
/*
Script by Mike McGrath- http://website.lineone.net/~mike_mcgrath
Featured on JavaScript Kit (http://j-avascriptkit.com)
For this and over 400+ free scripts, visit http://j-avascriptkit.com
*/
//Updated Feb 20th, 08 by JavaScriptKit.com: Script now compatible in IE7/FF
var standardbody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body //create reference to common "body" across doctypes
var nav = (!document.all || window.opera);
var tmr = null;
var spd = 50;
var x = 0;
var x_offset = 5;
var y = 0;
var y_offset = 15;
document.on-mousemove = get_mouse;
function get_mouse(e)
{
x = (nav) ? e.pageX : event.clientX+standardbody.scrollLeft;
y = (nav) ? e.pageY : event.clientY+standardbody.scrollTop;
x += x_offset;
y += y_offset;
beam(1);
}
function beam(n)
{
if(n<5)
{
document.getElementById('div'+n).style.top=y+'px'
document.getElementById('div'+n).style.left=x+'px'
document.getElementById('div'+n).style.visibility='visible'
n++;
tmr=setTimeout("beam("+n+")",spd);
}
else
{
clearTimeout(tmr);
fade(4);
}
}
function fade(n)
{
if(n>0)
{
document.getElementById('div'+n).style.visibility='hidden'
n--;
tmr=setTimeout("fade("+n+")",spd);
}
else clearTimeout(tmr);
}
// -->
</SCRIPT>
به آسانی با درج کدهای بالا می توانید شکل موس خود را به منظور جلب توجه و نظر کاربر در طراحی سایت تغییر نمایید.
منبع: طراحی سایت
