Artigo Introdução de wulin.com (www.vevb.com): Na janela QQ Chat, quando um amigo nos envia um link de URL, ao mover o mouse para o link, uma caixa de prompt aparecerá, levando -nos a abrir, copiar ou relatar. De fato, também podemos alcançar esse efeito na página da web. Hoje, ensinarei como alcançar o efeito imediato de clicar no link na janela QQ Chat.
Na janela QQ Chat, quando um amigo nos envia um link de URL, ao mover o mouse sobre o link, uma caixa prompt aparecerá, levando -nos a abrir, copiar ou relatar. De fato, também podemos alcançar esse efeito na página da web. Hoje, ensinarei como alcançar o efeito imediato de clicar no link na janela QQ Chat.
O código off é o seguinte:
<!
<html xmlns =>
<head>
<meta http-equiv = content-type content = text/html; charset = gb2312 />
<title> Como clicar no link na janela de bate -papo QQ imitando para mostrar o efeito imediato - aspku.com </ititle>
<idioma do script = javascript type = text/javascript>
função s (i) {return document.getElementById (i)}
função copyurl () {// copie URL
var clipboardcontent = s (downloaddirect) .href;
tentar{
window.clipboarddata.setData (texto, clipboardcontent);
alerta (este URL foi copiado para a área de transferência.);
} catch (e) {
Alerta (a cópia não tem sucesso, copie -a no navegador do IE.);
}
}
Document.OnClick = function (EVT) {// Ocultar a camada exibida ao clicar em um local que não é um link
var _target = evt? EVT.TARGET: Event.srcelement;
var _id = _target.id;
if (_id ==) {
_id = _target.tagname;
}
if (_id! = a) {
S (DownloadPanel) .style.display = 'nenhum';
}
}
window.onload = function () {// Quando a página da web é carregada, tudo sob o objeto especificado deve estar ligado.
var html = s (htmer);
var html1 = html.getElementsByTagName (a);
for (var i = 0, j = htmer1.length; i <j; i ++) {
html1 [i] .OnClick = function (evt) {
var _event = evt? EVT: Window.Event;
var _target = evt? EVT.TARGET: Window.Event.srcelement;
var _p = s (downloadPanel);
_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 (DownloadPanel) .style.display = '';
S (DownloadDirect) .href = this.href;
retornar falso;
}
}
}
</script>
<tipo de estilo = texto/css>
html, corpo {tamanho da fonte: 12px;}
a {color:#0000ff; decoração de texto: sublinhado; cursor: ponteiro;}
.Pointer {Cursor: Pointer;}
.Infobar {Background:#eAF9FF; Border: 1px Solid#1d5cbb; cor:#0000ff; margem-fundo: 10px; preenchimento: 8px 20px 4px 20px;}
</style>
</head>
<Body>
<div ID = Download StylePanel = Posição: Absoluto; topo: 0px; esquerda: 0px; largura: 160px; Z-Index: 999; preenchimento: 6px 2px 6px 10px; borda: 1px sólido #1d5cbb; display: nenhum; class = InfoBar>
<div estilo = preenchimento: 3px 0 0 0;> <a id = downloaddirect href = javascript: void (0); Target = _blank> Abrir url </a> & nbsp; & nbsp; <a id = downloadAgent href = javascript: void (0); OnClick = copyUrl ()> cópia </a> & nbsp; & nbsp; <a href = javascript: void (0) onclick = s ('downloadpanel'). style.display = 'nenhum';> fechar </a> </div>
</div>
<div id = htmer>
<p> <a href => </a> </p>
<p> <a href => </a> </p>
</div>
</body>
</html>