Rumah > Artikel > hujung hadapan web > 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 93f0f5c25f18dab9d176bd4f6de5d30e9c3bca370b5104690d9ef395f2c5f8d1 🎜>
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程序设计有所帮助。