Partager des exemples de mise en œuvre du centrage d'image et de l'effet flottant à l'aide de JS-js tutoriel-php.cn

Partager des exemples de mise en œuvre du centrage d'image et de l'effet flottant à l'aide de JS

小云云

Libérer： 2017-12-25 15:05:42

original

2062 Les gens l'ont consulté

Cet article vous explique principalement comment réaliser la suspension centrale verticale des images via JS Lorsque nous utilisons la souris pour faire défiler vers le bas, l'image sera centrée et suspendue sans suivre l'effet de défilement. Les amis intéressés peuvent suivre et. apprendre.

Regardons d'abord les rendus :

Regardons 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(http://www.php.cn/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>

Copier après la connexion

Recommandations associées :

Trois façons de centrer les images avec CSS

Comment implémenter du texte et des images avec HTML Code centré ?

JS implémente des effets spéciaux de fenêtres mobiles flottantes (publicités flottantes)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!