Introduction de l'article de wulin.com (www.vevb.com): Dans la fenêtre de chat QQ, lorsqu'un ami nous envoie un lien URL, lors du déplacement de la souris vers le lien, une boîte d'invite apparaîtra, ce qui nous incite à ouvrir, copier ou signaler. En fait, nous pouvons également réaliser cet effet sur la page Web. Aujourd'hui, je vais vous apprendre à réaliser l'effet rapide de cliquer sur le lien dans la fenêtre de chat QQ.
Dans la fenêtre de chat QQ, lorsqu'un ami nous envoie un lien URL, lors du déplacement de la souris sur le lien, une boîte d'invite apparaîtra, ce qui nous incite à ouvrir, copier ou signaler. En fait, nous pouvons également réaliser cet effet sur la page Web. Aujourd'hui, je vais vous apprendre à réaliser l'effet rapide de cliquer sur le lien dans la fenêtre de chat QQ.
Le code OFF est le suivant:
<! Doctype html public - // w3c // dtd xhtml 1.0 transitional // en>
<html xmlns =>
<adal>
<meta http-equiv = contenu contenu contenu = text / html; charse = gb2312 />
<Title> Comment cliquer sur le lien dans la fenêtre de chat Imitation QQ pour afficher l'effet de l'invite - ASPKU.com </TITME>
<Script Language = JavaScript Type = Text / JavaScript>
fonction s (i) {return document.getElementByid (i)}
function copyUrl () {// copier URL
var ClipboardContent = S (DownloadDirect) .Href;
essayer{
window.clipboarddata.setData (texte, ClipboardContent);
alerte (cette URL a été copiée dans le presse-papiers.);
} catch (e) {
alerte (la copie est infructueuse, veuillez le copier dans IE Browser.);
}
}
document.onclick = fonction (evt) {// masque le calque affiché lors de la cliquetis dans un emplacement qui n'est pas un lien
var _target = evt? evt.target: event.srcelement;
var _id = _target.id;
if (_id ==) {
_id = _target.tagname;
}
if (_id! = a) {
S (téléchargementpanel) .style.display = 'Aucun';
}
}
window.onload = function () {// Lorsque la page Web est chargée, tous un sous l'objet spécifié sont liés à être liés.
var html = s (htmer);
var html1 = html.getElementsByTagName (a);
pour (var i = 0, j = htmer1.length; i <j; i ++) {
html1 [i] .onclick = fonction (evt) {
var _event = evt? evt: window.event;
var _target = evt? evt.target: window.event.srcelement;
var _p = s (téléchargement);
_p.style.top = _event.clienty + document.body.scrolltop;
_p.style.left = (_event.clientx + document.body.scrollleft <160? _event.clientx + document.body.scrollleft + 10: _event.clientx + document.body.scrollleft - 120);
S (téléchargementpanel) .style.display = '';
S (téléchargementDirect) .href = this.href;
retourne false;
}
}
}
</cript>
<style type = text / css>
html, corps {taille de police: 12px;}
A {Couleur: # 0000FF; Text-Decoration: sous-trait; curseur: pointeur;}
.Pointer {curseur: pointeur;}
.infobar {Background: # eaf9ff; Border: 1Px Solid # 1D5CBB; Couleur: # 0000FF; margin-fond: 10px; padding: 8px 20px 4px 20px;}
</ style>
</ head>
<body>
<div id = downloadPanel style = position: absolu; top: 0px; gauche: 0px; largeur: 160px; z-index: 999; padding: 6px 2px 6px 10px; bordure: 1px solide # 1d5cbb; affichage: aucun; classe = infobar>
<div style = padding: 3px 0 0 0;> <a id = downloadDirect href = javaScript: void (0); Target = _blank> URL ouverte </a> & nbsp; & nbsp; <a id = téléchargement href = javascript: void (0); onClick = copyUrl ()> copy </a> & nbsp; & nbsp; <a href = javaScript: void (0) onClick = s ('downloadPanel'). style.display = 'nother';> close </a> </div>
</div>
<div id = htmer>
<p> <a href => </a> </p>
<p> <a href => </a> </p>
</div>
</docy>
</html>