communauté Apprendre Bibliothèque d'outils Loisirs

Français

Maison > interface Web > js tutoriel > javascript:google 向上向下滚动特效,兼容IE6,7,8,FF_javascript技巧

javascript:google 向上向下滚动特效,兼容IE6,7,8,FF_javascript技巧

WBOY

Libérer： 2016-05-16 18:21:18

original

1069 Les gens l'ont consulté

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>2010最新全面兼容ie6,ie7,ie8,ff的CSS HACK写法</title> 
<style type="text/css"> 
#google1 { 
border:none; 
width:270px; 
height:20px; 
margin:0px 0; 
font-size:12px; 
padding-left:0px; 
overflow:hidden; 
font-family:Arial; 
} 
#google1 ul { 
margin:0px; 
padding:0px; 
list-style-type:none; 
} 
#google1 li { 
line-height:20px; 
} 
</style> 
 
 
<div id="google1"> 
<ul id="dhooo1"> 
<li><a href="http://www.baidu.com" target="_blank" class="hei">轮回﹒修真﹒神话 创意新作《岐山》首度公开</a></li> 
<li><a href="http://www.jb51.net" target="_blank" class="hei">西游战记炫彩登场 1080P高清画面享受</a></li> 
<li><a href="http://s.jb51.net" target="_blank" class="hei">开测前必读 《西游战记》新手问题合辑</a></li> 
<li><a href="http://tools.jb51.net" target="_blank" class="hei">呕血推荐 《西游战记》36大亮点纵览</a></li> 
<li><a href="http://www.jb51.net/softs/" target="_blank" class="hei">1开测前必读 《西游战记》新手问题合辑</a></li> 
<li><a href="http://www.jb51.net/codes/" target="_blank" class="hei">2开测前必读 《西游战记》新手问题合辑</a></li> 
</ul> 
</div> 
<script type="text/javascript"> 
xS=function(A,B,C,D,E,F){ 
var $=function (id){return document.getElementById(id)},Y=+!!F; 
(A=$(A)).appendChild((B=$(B)).cloneNode(true)); 
(function (){ 
var m=A.scrollTop%C?(E||0):D; 
A.scrollTop=[0,B.offsetHeight][Y]==A.scrollTop?[B.offsetHeight-1,1][Y]:(A.scrollTop+[-1,1][Y]); 
setTimeout(arguments.callee,m); 
})() 
return arguments.callee; 
} 
xS('google1','dhooo1',20,3000,10,1); 
</script>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

这个代码是我之前带网上找的，因为今天再次用到，所以记录下来，免得以后都找不到，我现在想去搜它的说明文档都搜不到！

这个代码非常简洁，且浏览器兼容性超好，唯一的问题就是如果你要滚动多条的话就会有问题! 所以需要调参数C 和样式里面的高度

Étiquettes associées：

css hack

source：php.cn

Article précédent：jQuery中的bind绑定事件与文本框改变事件的临时解决方法_jquery Article suivant：结构/表现/行为完全分离的选项卡(jquery版和原生JS版)_jquery

Déclaration de ce site Web

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Derniers articles par auteur

Qu'est-ce qu'une NullPointerException et comment y remédier ?

2024-10-22 09:46:29
De novice à codeur : votre voyage commence par les principes fondamentaux du C

2024-10-13 13:53:41
Débloquer le développement Web avec PHP : guide du débutant

2024-10-12 12:15:51
Démystifier C : un chemin clair et simple pour les nouveaux programmeurs

2024-10-11 22:47:31
Libérez votre potentiel de codage : programmation C pour les débutants absolus

2024-10-11 19:36:51
Libérez votre programmeur intérieur : C pour les débutants absolus

2024-10-11 15:50:41
Automatisez votre vie avec C : scripts et outils pour les débutants

2024-10-11 15:07:41
PHP Made Easy : vos premiers pas dans le développement Web

2024-10-11 14:21:21
Construisez n'importe quoi avec Python : un guide du débutant pour libérer votre créativité

2024-10-11 12:59:11
La clé du codage : libérer la puissance de Python pour les débutants

2024-10-11 12:17:31

Derniers numéros

Où sont les didacticiels sur la cartographie mentale CSS ? Didacticiel

Depuis 2024-04-16 10:10:18

0

0

1335

La page ne peut soudainement plus extraire le CSS ou le bootstrap Je suis donc en train de développer une page, j'en ai fait une partie hier et ça a très bi...

Depuis 2024-04-06 21:58:04

0

1

800

Modifier dynamiquement les styles CSS en ligne dans Javafx J'essaie de changer l'image d'arrière-plan d'un volet lorsque l'application est agrandie. ...

Depuis 2024-04-06 20:57:16

0

1

487

Comment empiler les éléments flottants verticalement plutôt qu'horizontalement en CSS ? J'essaie de créer une page Web avec deux colonnes, avec le contenu principal d'un côté et ...

Depuis 2024-04-06 20:45:26

0

2

386

Existe-t-il un moyen de forcer le texte de la flexbox à être centré verticalement, quel que soit l'autre code CSS dont nous disposons ? J'ai le code CSS suivant qui fait partie d'un code CSS plus vaste utilisé dans un site Web...

Depuis 2024-04-06 20:41:51

0

1

518

Rubriques connexes

Plus>

Recommandations populaires

Tutoriels populaires

Plus>

Tutoriels associés

Recommandations populaires

Derniers cours

Derniers téléchargements

Plus>

effets Web

Code source du site Web

Matériel du site Web

Modèle frontal