Maison >interface Web >js tutoriel >Comment obtenir l'effet flottant centré des images dans JS

Comment obtenir l'effet flottant centré des images dans JS

亚连original: 2018-06-15 16:05:322428parcourir

Cet article partage avec vous l'effet du centrage vertical et du flottement des images via JS sans suivre la barre de défilement. Les amis intéressés peuvent suivre et apprendre.

Dans cet article, nous utilisons JS pour obtenir un effet de flottement d'image Lorsque nous utilisons la souris pour faire défiler vers le bas, l'image est suspendue au centre et ne suit pas le défilement. l'image d'abord :

Jetons un coup d'œil à tous les codes testés :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
.logo {
 width: 650px;
 height: 383px;
 position:fixed;
 background: url(//www.jb51.net/images/logo.gif) no-repeat;
 margin:auto;
 left:0;
 right:0;
 top:0;
 bottom:0;
}
</style>
<title>图片垂直居中不随滚动条滚动的JS代码</title>
</head>
<body style="height:3000px">
<p class="logo"> </p>
<p>脚本之家JS图片悬浮图片效果</p>
</body>
</html>

Ce qui précède est ce que j'ai compilé pour tout le monde, j'espère que ce sera le cas. être utile à tout le monde à l’avenir.

Articles Liés

Voir plus