我正在进行具有背景图片幻灯片效果的导航。主要思想是有三个列表项包含相同的背景图像但位置不同。每个项目的背景图像将被动画化以在不同时间滑动到位。 中间列表项的背景图像滑动方向取决于用户之前的项目：从右侧开始，它将从左侧滑动，反之亦然。 最重要的是，我们将有半透明背景滑动的子菜单。它们将滑入其位置并更改颜色。 有一个网站具有相同的效果：http://tympanus.net/Tutorials/BeautifulBackgroundImageNavigation/ 我还将我的编码放在jsfiddle中：http://jsfiddle.net/9rctyuzb/
对于我的工作，子菜单没有移动，他们坚持图像，即使他们所处的图像没有滑入，我想也许原因可能是尺寸的变化，因为我这样做对于480 * 800手机尺寸，这就是为什么我必须改变所有尺寸以适应手机屏幕。
无法包含在jsfiddle中的编码：http://jsfiddle.net/9rctyuzb/
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<title>About Us</title>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
<script src="http://rafaelcastrocouto.github.io/jquery.bgpos/lib/jquery-1.7.2.min.js"> </script>