Penjelasan terperinci tentang kemahiran penggunaan overlib JS plug-in examples_javascript

Contoh dalam artikel ini menerangkan penggunaan overlib. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:

overLIB ialah kod JS yang sangat baik yang menghasilkan kesan halaman seperti kotak gesaan dan menu timbul.

Ia hanya boleh menukar gaya, kulit dan bentuk halaman pop timbul dengan menetapkan beberapa parameter atau arahan Bukan itu sahaja, ia juga menyediakan fungsi sambungan yang sangat mudah untuk memenuhi keperluan pelanggan yang berbeza.

overLIB sangat mudah digunakan.

1. Tambahkan dalam teg 🎜>

2. Tambahkan dalam teg : Salin kod

Kodnya adalah seperti berikut:

< div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;">

Langkah ini boleh diabaikan untuk versi 4.10 dan ke atas 3. Hasilkan dua gaya halaman timbul (pop timbul dan melekit)

4. Commandes et paramètres

pop-up

Nom de l'attribut	Tapez	Obligatoire	Par défaut	Description
texte	chaîne	Oui	n/a	le texte/html à afficher dans la fenêtre popup
déclencheur	chaîne	Non	onMouseOver	Ce qui est utilisé pour déclencher la fenêtre popup. Peut être l'un des onMouseOver ou onClick
collant	booléen	Non	faux	Fait en sorte que la fenêtre contextuelle reste jusqu'à ce qu'elle soit fermée
légende	chaîne	Non	n/a	définit la légende sur titre
fgcolor	chaîne	Non	n/a	couleur de l'intérieur de la popup box
bgcolor	chaîne	Non	n/a	couleur de la bordure de la popup box
couleur du texte	chaîne	Non	n/a	définit la couleur du texte à l'intérieur de la boîte
couleur du bonnet	chaîne	Non	n/a	définit la couleur de la légende de la boîte
fermer la couleur	chaîne	Non	n/a	définit la couleur du texte de fermeture
police de texte	chaîne	Non	n/a	définit la police à utiliser par le texte principal
police de légende	chaîne	Non	n/a	définit la police de la légende
fermer la police	chaîne	Non	n/a	définit la police du texte "Fermer"
taille du texte	chaîne	Non	n/a	définit la taille de la police du texte principal
taille des légendes	chaîne	Non	n/a	définit la taille de la police de la légende
fermer la taille	chaîne	Non	n/a	définit la taille de la police du texte "Fermer"
largeur	entier	Non	n/a	définit la largeur de la boîte
hauteur	entier	Non	n/a	définit la hauteur de la boîte
à gauche	booléen	Non	faux	fait aller les popups à gauche de la souris
c'est vrai	booléen	Non	faux	fait aller les popups à droite de la souris
centre	booléen	Non	faux	fait aller les popups au centre de la souris
ci-dessus	booléen	Non	faux	fait passer les popups au-dessus de la souris. REMARQUE : possible uniquement lorsque la hauteur a été définie
ci-dessous	booléen	Non	faux	fait passer les popups sous la souris
frontière	entier	Non	n/a	rend la bordure des popups plus épaisse ou plus fine
offsetx	entier	Non	n/a	à quelle distance du pointeur la fenêtre contextuelle apparaîtra, horizontalement
décalage	entier	Non	n/a	à quelle distance du pointeur la fenêtre contextuelle apparaîtra, verticalement
fgfond	URL de l'image	Non	n/a	définit une image à utiliser à la place de la couleur pour l'intérieur de la popup.
bgfond	URL de l'image	Non	n/a	définit une image à utiliser à la place de la couleur pour la bordure de la popup. REMARQUE : vous souhaiterez définir bgcolor sur "" ou la couleur s'affichera également. REMARQUE : lors d'un lien Fermer, Netscape restituera les cellules du tableau, ce qui donnera un aspect incorrect
texte proche	chaîne	Non	n/a	définit le texte "Fermer" sur autre chose
pas de fermeture	booléen	Non	n/a	n'affiche pas le texte "Fermer" sur les stickies avec une légende
statut	chaîne	Non	n/a	définit le texte dans la barre d'état du navigateur
statut automatique	booléen	Non	n/a	définit le texte de la barre d'état sur le texte de la fenêtre contextuelle. REMARQUE : remplace le paramètre d'état
autostatuscap	chaîne	Non	n/a	définit le texte de la barre d'état sur le texte de la légende. REMARQUE : remplace les paramètres d'état et d'état automatique
inarray	entier	Non	n/a	indique à overLib de lire le texte de cet index dans le tableau ol_text, situé dans overlib.js. Ce paramètre peut être utilisé à la place du texte
caparray	entier	Non	n/a	indique à overLib de lire la légende de cet index dans le tableau ol_caps
capicon	url	Non	n/a	affiche l'image donnée avant la légende contextuelle
snapx	entier	Non	n/a	accroche la fenêtre contextuelle à une position paire dans une grille horizontale
vivant	entier	Non	n/a	accroche la fenêtre contextuelle à une position paire dans une grille verticale
fixx	entier	Non	n/a	verrouille la position horizontale des popups Remarque : remplace tout autre placement horizontal
fixe	entier	Non	n/a	verrouille la position verticale des popups Remarque : remplace tout autre placement vertical
fond	url	Non	n/a	définit l'image à utiliser à la place de l'arrière-plan de la zone de tableau
padx	entier, entier	Non	n/a	remplit l'image d'arrière-plan avec des espaces horizontaux pour le placement du texte. Remarque : il s'agit d'une commande à deux paramètres
pady	entier, entier	Non	n/a	remplit l'image d'arrière-plan avec des espaces verticaux pour le placement du texte. Remarque : il s'agit d'une commande à deux paramètres
html complet	booléen	Non	n/a	vous permet de contrôler complètement le code HTML sur une image d'arrière-plan. Le code html est attendu dans l'attribut "texte"
cadre	chaîne	Non	n/a	controls popups in a different frame. See the overlib page for more info on this function
timeout	string	No	n/a	calls the specified javascript function and takes the return value as the text that should be displayed in the popup window
delay	integer	No	n/a	makes that popup behave like a tooltip. It will popup only after this delay in milliseconds
hauto	boolean	No	n/a	automatically determine if the popup should be to the left or right of the mouse.
vauto	boolean	No	n/a	automatically determine if the popup should be above or below the mouse.

overLIB 可以接受任意个命令和参数。格式如下：命令[,'命令参数']

<a href="javascript:void(0);" onclick="return overlib('This is a sticky with a caption. And it is centered under the mouse!', STICKY, CAPTION,
'Sticky!', CENTER);" onmouseout="nd();">Click here!</a>

五、 overlib的一些使用示例

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<scriptlanguage="JavaScript" src="overlib.js"></script><html>
<head>
<metahttp-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<body>
<ahref="#" onclick="return overlib('使用overlib的命令', CAPTION, '这是Caption命令，就是生成头部',HAUTO);"" onmouseout="return nd();">弹出测试</a>
<ahref="javascript:void(0);" onmouseover="return overlib('This is an ordinary popup.',CLOSECLICK);" onmouseout="return nd();">here</a>
<ahref="javascript:void(0);" onmouseover="return overlib('This is what we call a sticky, since I stick around (it goes away if you move the mouse OVER and then OFF the overLIB popup--or mouseover another overLIB).', STICKY, MOUSEOFF);" onmouseout="return nd();">吸附性的提示框</a>
<ahref="javascript:void(0);" onclick="return overlib('This is a sticky with a caption. And it is centered under the mouse!', STICKY, CAPTION,'Sticky!',CENTER);">含CAPTION的STICKY!</a>
<ahref="javascript:void(0);" onclick="return overlib('Setting size and posiztion!', STICKY, CAPTION,'Sticky!',HEIGHT, 100,WIDTH,120,LEFT);">指定大小与位置弹出</a>
<ahref="javascript:void(0);" onclick="return overlib('Setting size and posiztion!', STICKY, CAPTION,'Sticky!',STATUS ,'Hello');">设置状态栏</a>
</body>
</html>

六、自定义overlib。overlib有三种方式可以实现自定义。

1、我们上面用过的通过输入不同命令来实现自定义。
2、修改overlib.js中的默认值来实现自定义
3、在引用的页面指定变量来实现自定义。

overlib点击此处本站下载。

希望本文所述对大家JavaScript程序设计有所帮助。