JQuery对联广告

最新推荐文章于 2021-10-13 16:30:03 发布

Bear

最新推荐文章于 2021-10-13 16:30:03 发布

阅读量305

点赞数

分类专栏： JQuery 文章标签： jquery 对联

本文链接：https://blog.csdn.net/bear_huangzhen/article/details/102462044

版权

这篇博客详细介绍了如何利用JQuery库创建对联广告的效果。通过实例代码展示，作者解释了JQuery的选择器、事件处理和动态操作DOM等技巧在实现这一效果中的应用。

摘要由CSDN通过智能技术生成

示例（Jquery对联广告）：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>JQuery对联广告</title>
		<style type="text/css">
			p{
				width: 300px;
				margin: 20px auto;
			}
			
			.ad{
				height: 300px;
				width: 200px;
				position: fixed;
				left: 0px;
				top: 50%;
				margin-top: -150px;
				border: 2px solid red;
			}
			
			.ad-right{
				right: 0px;
				left: auto;
			}
			
			.ad span{
				position: absolute;
				top: 0px;
				right: 0px;
				cursor: pointer;
				font-size: 20px;
			}
			
			.ad-right span{
				left: 0px;
			}
			
		</style>
		<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
		<script type=&