Cửa sổ popup tự động trượt

JavaScriptBank · 28/1/10

Đoạn mã JavaScript này sẽ tạo một

You must be registered for see links

ngay bên trong trang web bằng cách sử dụng mộ...

You must be registered for see links

tại

You must be registered for see links

Demo:

You must be registered for see links

|

You must be registered for see links

Cách cài đặt

Bước 1: Dùng mã CSS bên dưới cho việc định dạng hiệu ứng
CSS

Mã:

<style type="text/css">
/*
     This script downloaded from www.JavaScriptBank.com
     Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/
.jsbank_sample_cont {margin: 20px; padding: 20px;}
.jsbank_sample_tit {font-weight: bold; margin-bottom: 10px; padding: 5px; width: auto; background-color: #c0c0c0; border: 5px solid #a0a0a0; color: black; text-align: center;}
/*
Created by: Jeroen Haan 
Web Site: http://www.haan.net/ 

*/
#layer1 {
	position: absolute;
	visibility: hidden;
	width: 400px;
	height: 300px;
	left: 20px;
	top: 300px;
	background-color: #ccc;
	border: 1px solid #000;
	padding: 10px;
}

#close {
	float: right;
}
</style>

Bước 2: Copy mã JavaScript bên dưới và dán vào khu vực HEAD trên trang web của bạn
JavaScript

Mã:

<SCRIPT type=text/javascript>
<!--
// Created by: Jeroen Haan :: http://www.haan.net/

/* -----------------------------------------------
   Floating layer - v.1
   (c) 2006 www.haan.net
   contact: [email protected]
   You may use this script but please leave the credits on top intact.
   Please inform us of any improvements made.
   When usefull we will add your credits.
  ------------------------------------------------ */

x = 20;
y = 70;
function setVisible(obj)
{
	obj = document.getElementById(obj);
	obj.style.visibility = (obj.style.visibility == 'visible') ? 'hidden' : 'visible';
}
function placeIt(obj)
{
	obj = document.getElementById(obj);
	if (document.documentElement)
	{
		theLeft = document.documentElement.scrollLeft;
		theTop = document.documentElement.scrollTop;
	}
	else if (document.body)
	{
		theLeft = document.body.scrollLeft;
		theTop = document.body.scrollTop;
	}
	theLeft += x;
	theTop += y;
	obj.style.left = theLeft + 'px' ;
	obj.style.top = theTop + 'px' ;
	setTimeout("placeIt('layer1')",500);
}
window.onscroll = setTimeout("placeIt('layer1')",500);
//-->
</SCRIPT>

Bước 3: Copy mã HTML bên dưới và dán vào khu vực BODY trên trang web của bạn
HTML

Mã:

<DIV id=layer1><SPAN id=close><A style="TEXT-DECORATION: none" 
href="javascript:setVisible('layer1')"><STRONG>Hide</STRONG></A></SPAN> 
<P>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy 
nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi 
enim ad minim veniam, quis nostrud exerci.</P><BR><BR><IMG height=65 
src="../image/logojs.gif" width=120 border=0> </DIV>
<p>This link uses the onclick event handler.<br>
<a href="#" onclick="setVisible('layer1');return false" target="_self">Open popup</a></p>

<p>This next one uses the javascript link inside the href tag.<br>
<a href="javascript:setVisible('layer1',true)">Open popup</a></p>

<form>
And this one uses the input button inside a form tag.<br>
  <input type="button" value="Open popup" onclick="setVisible('layer1')">
</form>

<p>It can also be used in an image map. Here, the word 'Webhost' contains the link<br>
<img src="../image/logojs.gif" width="120" height="65" border="0" usemap="#Map">
  <map name="Map" id="Map">
    <area shape="rect" coords="1,1,113,23" href="#" onclick="setVisible('layer1');return false" target="_self">
  </map>

Các hiệu ứng tương tự
-

You must be registered for see links

-

You must be registered for see links

-

You must be registered for see links

Một vài nhãn tương tự:

You must be registered for see links

,

You must be registered for see links

,

You must be registered for see links

,

You must be registered for see links

,

You must be registered for see links

,

You must be registered for see links

,

You must be registered for see links

,

You must be registered for see links

Bạn có thể xem thêm nhiều JavaScript khác về

You must be registered for see links

và

You must be registered for see links

-

You must be registered for see links

-

You must be registered for see links

Cửa sổ popup tự động trượt

JavaScriptBank

New member