کد چرخش متن دور اشاره گر ماوس

بار ها پیش آمده که بخواهیم برای وبلاگ خود و برای اشاره گر موس آن یک افکت زیبا به وجود اوریم هم اکنون در این پست از یک لرن کدی را دریافت میکنید که به وسیله ان میتوانید یک متن را با رنگ و فونت و اندازه دلخواه دور موس به چرخش درآورید پیش نمایش کد چرخش متن دور اشاره گر ماوس را مشاهده کنید و سپس به ادامه مطلب مراجعه فرمایید …

پیش نمایش

کد زیر به کلی کپی و قبل از تگ </head > در ویرایش قالب خود قرار دهید
اگر میخواهید تغییرات جزئی ایجاد کنید به توضیحات زیر دقت کنید
1- در خط هشتم میتوانید فونت مربوط به نوشته را جایگزین کنید
2- در خط یازدهم میتوانید رنگ مورد نظر خود را به جای red وارد کنید
3- در خط 26 در بین دو علامت ” ” پیام خود را جایگزین کنید
4- در خط 28 به جای 15 سایز نوشته مورد نظر خود را وارد کنید
<!-- کد چرخش متن دور ماوس از یک لرن دات ای ار -->
<script type="text/javascript"src="http://dl.1learn.ir/admin/1learn/1learn.js"></script>
<style type="text/css">
#outerCircleText {
font-style: Times New Roman;
font-weight: bold;
/* تنظیم فونت نوشته */
font-family: tahoma, verdana, times new roman;
/**/
/* تنظیم رنگ نوشته */
color: RED;
/**/
position: absolute;
top: 0;
left: 0;
z-index: 3000;
cursor: default;
}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
</style>
<p>
<script type="text/javascript">
;(function(){
// پیام در این قسمت قرار میگیرد
var msg = " 1learn.ir  ";
// سایز نوشته
var size = 15;
var circleY = 0.75; var circleX = 2;
var letter_spacing = 5;
// قطر دایره
var diameter = 10;
var rotation = 0.4;
var speed = 0.3;
// کد جاوا اسکریپت
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,
mouse = function(e){
 e = e || window.event;
 ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; 
 xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; 
},
makecircle = function(){ 
 if(init.nopy){
  o.style.top = (b || document.body).scrollTop + 'px';
  o.style.left = (b || document.body).scrollLeft + 'px';
 };
 currStep -= rotation;
 for (var d, i = n; i > -1; --i){ 
  d = document.getElementById('iemsg' + i).style;
  d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
  d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
 };
},
drag = function(){ 
 y[0] = Y[0] += (ymouse - Y[0]) * speed;
 x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
 for (var i = n; i > 0; --i){
  y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
  x[i] = X[i] += (x[i-1] - X[i]) * speed;
 };
 makecircle();
},
init = function(){ 
 if(!isNaN(window.pageYOffset)){
  ymouse += window.pageYOffset;
  xmouse += window.pageXOffset;
 } else init.nopy = true;
 for (var d, i = n; i > -1; --i){
  d = document.createElement('div'); d.id = 'iemsg' + i;
  d.style.height = d.style.width = a + 'px';
  d.appendChild(document.createTextNode(msg[i]));
  oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
 };
 o.appendChild(oi); document.body.appendChild(o);
 setInterval(drag, 25);
},
ascroll = function(){
 ymouse += window.pageYOffset;
 xmouse += window.pageXOffset;
 window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
 window.addEventListener('load', init, false);
 document.addEventListener('mouseover', mouse, false);
 document.addEventListener('mousemove', mouse, false);
  if (/Apple/.test(navigator.vendor))
  window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
 window.attachEvent('onload', init);
 document.attachEvent('onmousemove', mouse);
};
})();
</script>
<!-- کد چرخش متن دور ماوس از یک لرن دات ای ار -->

فرادرس

برچسب ها : ، ، ، ، ، ، ،