jquery实现鼠标XY轴视差效果，默认页面滚动控制显示隐藏内容，适用于移动营销方式介绍图文布局代码。 说明：js效果一共俩个，第一实现背景随着鼠标流动，第二实现滚动显示隐藏的内容，判断浏览器的高度。 结构清晰，下载即可使用。

使用方法

1、head引入css文件

<link href="css/style.css" rel="stylesheet" type="text/css"/>

2、head引入js文件

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>

3、body引入HTML代码

<div style="height:400px;"></div> <!--  滚动显示 里面的内容 默认需要在“marketing-box”上面加上高度 需向下滑动 才可显示内容 -->
<div class="marketing-box">
	<div class="marketing-head">
		<h2>全方位移动营销时代，你准备好了吗？</h2>
		<p>十年巨变！移动互联网已颠覆我们的时代，商业、社交、视频、新闻、工具等领域，移动应用渗透率已超过80%，在团购、旅游和零售业，移动端收入规模已经超越PC端，手机APP已经成为企业不可或缺的线上阵地。</p>
	</div>
	<div class="marketing-warp image">
		<div class="marketing-bg"></div>
		<div class="item-1" data-offset="true" data-offsetx="40" data-offsety="20"></div>
		<div class="item-2" data-offset="true" data-offsetx="20" data-offsety="10"></div>
		<div class="phone phone-1"><img src="images/info-iphone1.png" alt=""></div>
		<div class="phone phone-2"><img src="images/info-iphone2.png" alt=""></div>
		<div class="phone phone-3"><img src="images/info-iphone3.png" alt=""></div>
		<div class="phone phone-4"><img src="images/info-iphone4.png" alt=""></div>
		<div class="phone phone-5"><img src="images/info-iphone5.png" alt=""></div>
	</div>
</div>


<script type="text/javascript" src="js/script.js"></script>

资源出处：https://www.moyublog.com/codes/10656.html