Share code JavaScript hiệu ứng 3 màu quay xung quanh chuột : HTML / CSS / JavaScript

Xem bài viết chưa trả lời | Xem chủ đề đang hoạt động

Trang chủ » Kiến thức lập trình » HTML / CSS / JavaScript

Thời gian được tính theo giờ UTC + 7 Giờ

Share code JavaScript hiệu ứng 3 màu quay xung quanh chuột

Các điều hành viên: Mod, SMod, Admin

Bạn đang xem trang 1 / 1 trang

[ 1 bài viết ]

Xem bản in | Gửi Email giới thiệu

Chủ đề trước | Chủ đề kế tiếp

Người gửi

Nội dung

Vuonghh1998

Tiêu đề bài viết: Share code JavaScript hiệu ứng 3 màu quay xung quanh chuột

Đã gửi: 23/02/2016 05:23

☀️9/30☀️

Ngày tham gia: 07/04/2014 22:59
Bài viết: 638
Đến từ: Vĩnh Phúc
Số điện thoại: 0974897106

Copy code này, cho vào 1 file .js rồi up lên web của bạn.
Thêm đoạn code

Mã:

<?php
<script language="javascript" type="text/javascript" src="link tới file.js"></script>
?>

vào bất cứ đâu trong web của bạn.

<?php
if ( navigator.appName == 'Netscape' ) {
if  ((document.getElementById) && 
window.addEventListener || window.attachEvent){

(function(){

//Configure here...

var xCol = "#7E9EE5";
var yCol = "#E27B14";
var zCol = "#15D108";
var n = 5;   //number of dots per trail.
var t = 40;  //setTimeout speed.
var s = 0.15; //effect speed.

//End.

var r,h,w;
var d = document;
var my = 10;
var mx = 10;
var stp = 0;
var evn = 360/3;
var vx = new Array();
var vy = new Array();
var vz = new Array();
var dy = new Array();
var dx = new Array();

var pix = "px";

var strictmod = ((document.compatMode) && 
document.compatMode.indexOf("CSS") != -1);


var domWw = (typeof window.innerWidth == "number");
var domSy = (typeof window.pageYOffset == "number");
var idx = d.getElementsByTagName('div').length;

for (i = 0; i < n; i++){
var dims = (i+1)/2;
d.write('<div id="x'+(idx+i)+'" style="position:absolute;'
+'top:0px;left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+xCol+';font-size:'+dims+'px"><\/div>'

+'<div id="y'+(idx+i)+'" style="position:absolute;top:0px;'
+'left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+yCol+';font-size:'+dims+'px"><\/div>'

+'<div id="z'+(idx+i)+'" style="position:absolute;top:0px;'
+'left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+zCol+';font-size:'+dims+'px"><\/div>');
}

if (domWw) r = window;
else{ 
  if (d.documentElement && 
  typeof d.documentElement.clientWidth == "number" && 
  d.documentElement.clientWidth != 0)
  r = d.documentElement;
 else{ 
  if (d.body && 
  typeof d.body.clientWidth == "number")
  r = d.body;
 }
}


function winsize(){
var oh,sy,ow,sx,rh,rw;
if (domWw){
  if (d.documentElement && d.defaultView && 
  typeof d.defaultView.scrollMaxY == "number"){
  oh = d.documentElement.offsetHeight;
  sy = d.defaultView.scrollMaxY;
  ow = d.documentElement.offsetWidth;
  sx = d.defaultView.scrollMaxX;
  rh = oh-sy;
  rw = ow-sx;
 }
 else{
  rh = r.innerHeight;
  rw = r.innerWidth;
 }
h = rh; 
w = rw;
}
else{
h = r.clientHeight; 
w = r.clientWidth;
}
}


function scrl(yx){
var y,x;
if (domSy){
 y = r.pageYOffset;
 x = r.pageXOffset;
 }
else{
 y = r.scrollTop;
 x = r.scrollLeft;
 }
return (yx == 0)?y:x;
}


function mouse(e){
var msy = (domSy)?window.pageYOffset:0;
if (!e) e = window.event;    
 if (typeof e.pageY == 'number'){
  my = e.pageY - msy + 16;
  mx = e.pageX + 6;
 }
 else{
  my = e.clientY - msy + 16;
  mx = e.clientX + 6;
 }
if (my > h-65) my = h-65;
if (mx > w-50) mx = w-50;
}



function assgn(){
for (j = 0; j < 3; j++){
 dy[j] = my + 50 * Math.cos(stp+j*evn*Math.PI/180) * Math.sin((stp+j*25)/2) + scrl(0) + pix;
 dx[j] = mx + 50 * Math.sin(stp+j*evn*Math.PI/180) * Math.sin((stp+j*25)/2) * Math.sin(stp/4) + pix;
}
stp+=s;

for (i = 0; i < n; i++){
 if (i < n-1){
  vx.top = vx[i+1].top; vx.left = vx[i+1].left; 
  vy.top = vy[i+1].top; vy.left = vy[i+1].left;
  vz.top = vz[i+1].top; vz.left = vz[i+1].left;
 } 
 else{
  vx.top = dy[0]; vx.left = dx[0];
  vy.top = dy[1]; vy.left = dx[1];
  vz.top = dy[2]; vz.left = dx[2];
  }
 }
setTimeout(assgn,t);
}


function init(){
for (i = 0; i < n; i++){
 vx = document.getElementById("x"+(idx+i)).style;
 vy = document.getElementById("y"+(idx+i)).style;
 vz = document.getElementById("z"+(idx+i)).style;
 }
winsize();
assgn();
}


if (window.addEventListener){
 window.addEventListener("resize",winsize,false);
 window.addEventListener("load",init,false);
 document.addEventListener("mousemove",mouse,false);
}  
else if (window.attachEvent){
 window.attachEvent("onload",init);
 document.attachEvent("onmousemove",mouse);
 window.attachEvent("onresize",winsize);
} 

})();
}//End.
}
?>

Chúc thành công!

_________________
• Facebook
• Website

Đầu trang

Bạn đang xem trang 1 / 1 trang

[ 1 bài viết ]

Trang chủ » Kiến thức lập trình » HTML / CSS / JavaScript

Thời gian được tính theo giờ UTC + 7 Giờ

Chủ đề		Người gửi	Trả lời	Xem	Bài viết mới nhất
Chủ đề tương tự
	Share code JavaScript hiệu ứng link đổi nhiều màu	Vuonghh1998	0	988	21/02/2016 21:06 Vuonghh1998
	Share code JavaScript nút Go Top - Bottom ở góc dưới, bên phải	Vuonghh1998	0	989	22/02/2016 05:29 Vuonghh1998
	Code chuyển hướng trang bằng PHP, HTML, JavaScript, htaccess	nghiammo1992	8	2053	21/08/2016 20:25 vipmathuah
	[Share Code] Code Xem Tv Trực Tuyến Bằng Html	Tamhoangdk	0	2470	13/11/2013 22:40 Tamhoangdk
	[Javascript] Làm tiêu đề chạy qua lại luân phiên	Dajgiachandat	0	920	18/11/2015 17:48 Dajgiachandat
	[JavaScript] Đăng kí dạng móc kéo	Dajgiachandat	0	1076	21/11/2015 20:01 Dajgiachandat
	Code CSS và Code ngày giờ,nhận dạng trình duyệt mobile	Vuonghh1998	2	1627	22/01/2016 18:16 Vuonghh1998
	[jQuery] Khóa các tính năng khi click chuột phải	Vuonghh1998	0	1010	21/02/2016 21:02 Vuonghh1998
	[Share] Code trang trí giáng sinh cho website cực đẹp	nghiammo1992	0	1553	16/12/2013 00:40 nghiammo1992
	[Share] Code Google +1, Like Facebook cho website	nghiammo1992	2	1425	07/02/2014 20:41 Tamhoangdk

Ai đang trực tuyến?

Đang xem chuyên mục này: Không có thành viên nào đang trực tuyến và 9 khách

Bạn không thể tạo chủ đề mới trong chuyên mục này.
Bạn không thể trả lời bài viết trong chuyên mục này.
Bạn không thể sửa những bài viết của mình trong chuyên mục này.
Bạn không thể xoá những bài viết của mình trong chuyên mục này.

Chuyển đến:

CHIASE123.COM - Diễn đàn chia sẻ kiến thức

Share code JavaScript hiệu ứng 3 màu quay xung quanh chuột

Ai đang trực tuyến?