html5千寻浏览器官网页面滚屏展示特效



115 456 153



特效描述:html5 千寻浏览器官网 页面滚屏展示特效,html5页面滚屏展示

代码结构

1. 引入CSS

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

2. 引入JS

<script src="style/js/jquery-1.11.1.min_7e57d31.js"></script>
<script src="style/js/jquery-ui-1.10.4.custom.min_c49b322.js"></script>
<script src="style/js/jquery.mousewheel.min_14a6833.js"></script>
<script src="style/js/modernizr.custom.42389_32afb40.js"></script>
<script src="style/js/client_f1d5015.js"></script>
<script src="style/js/main_02e9833.js"></script>
<script src="style/js/DD_belatedPNG_0.0.8a_f156f4a.js"></script>

3. HTML代码

		<div id="container" class="main-expanding">
			<h1 id="top-left-bar" class="top-bar">千寻浏览器</h1>
			<a id="top-right-bar" class="top-bar" href="" target="_blank">下载千寻壁纸</a>
			<div id="nav">
				<ul>
					<li>
						<a href="#aboutus" id="link-about">
							<span class="link-text-wrapper">
								<span class="link-text">
									<em class="link-icon"></em>关于我们
								</span>
							</span>
						</a>
					</li>
					<li>
						<a href="#update" id="link-log">
							<span class="link-text-wrapper">
								<span class="link-text">
									<em class="link-icon"></em>版本日志
								</span>
							</span>
						</a>
					</li>
					<li>
						<a href="#faq" id="link-guide">
							<span class="link-text-wrapper">
								<span class="link-text">
									<em class="link-icon"></em>千寻十问
								</span>
							</span>
						</a>
					</li>
					<li>
						<a href="http://chajian.qxllq.com" id="link-app" target="_blank">
							<span class="link-text-wrapper">
								<span class="link-text">
									<em class="link-icon"></em>应用商店
								</span>
							</span>
						</a>
					</li>
					<li>
						<a href="http://bbs.qxllq.com" id="link-comment" target="_blank">
							<span class="link-text-wrapper">
								<span class="link-text">
									<em class="link-icon"></em>论坛反馈
								</span>
							</span>
						</a>
					</li>
				</ul>
				<div id="nav-overlay"></div>
			</div>
			<ul id="slide-bar">
				<li class="slide-bar-active">
					<a href=""></a>
				</li>
				<li>
					<a href=""></a>
				</li>
				<li>
					<a href=""></a>
				</li>
				<li>
					<a href=""></a>
				</li>
				<li>
					<a href=""></a>
				</li>
				<li>
					<a href=""></a>
				</li>
				<li>
					<a href=""></a>
				</li>
			</ul>
			<span id="logo" class="logo original-logo"><img alt="" src="style/images/balloon_fdb9722.png" /></span>
			<span id="logo-text"><img alt="千寻" src="style/images/logo-text_0f1b4c4.png" /></span>
			<a id="button-download" href="">
				<img alt="" src="style/images/button-download_c3d7979.png" />
			</a>
			<div id="main">
				<span id="logo-text-point"><img alt="千寻" src="style/images/logo-text-point_329aae6.png" /></span>
				<ul id="boxes">
					<li class="boxes-item-first">
						<img class="wallpaper" alt="" src="style/images/wallpaper1_aacd261.jpg" data-src="http://www.qxllq.com/theme/images/wallpapers/wallpaper1-static_ebbb0ca.jpg" />
						<span data-anim="anim-logo" class="logo-group logo-g1 original-logo logo anim anim-logo">
							<img alt="" src="style/images/balloon_fdb9722.png" />
						</span>
						<span data-anim="anim-cloud-large-once" class="anim cloud-large cloud-large-once anim-cloud-large-once scale"></span>
						<span data-anim="anim-cloud-small-once" class="anim cloud-small cloud-small-once anim-cloud-small-once scale"></span>
						<span data-anim="anim-cloud-large" class="anim cloud-large anim-cloud-large scale"></span>
						<span data-anim="anim-cloud-small" class="anim cloud-small anim-cloud-small scale"></span>
					</li>
					<li>
						<img class="wallpaper" alt="" src="style/images/wallpaper7_45d966c.jpg" />
						<span class="logo-group logo-g7">
							<span class="logo anim logo-compass">
								<img alt="" src="style/images/compass_c5234dc.png" />
							</span>
							<span data-anim="anim-logo-compass-pointer" class="logo anim logo-compass-pointer">
								<img alt="" src="style/images/compass-pointer_8b29f62.png" />
								<img alt="" src="style/images/compass-pointer-ie_d9332c2.png" />
							</span>
						</span>
						<span data-anim="anim-balloon-mini" class="anim balloon-mini">
							<img alt="" src="style/images/fire-balloon-mini_4b46187.png" />
						</span>
					</li>
					<li>
						<img class="wallpaper" alt="" src="style/images/wallpaper2_4dbc47d.jpg" />
						<span class="logo-group logo-g3">
							<span data-anim="anim-logo-conch" class="logo anim logo-conch">
								<img alt="" src="style/images/conch_0f510b1.png" />
							</span>
							<span class="logo anim logo-conch-static">
								<img alt="" src="style/images/conch-static_1a6b019.png" />
							</span>
						</span>
						<span data-anim="anim-bubble-1" class="anim bubble-large bubble-1 scale"></span>
						<span data-anim="anim-bubble-2" class="anim bubble-large bubble-2 scale"></span>
						<span data-anim="anim-bubble-3" class="anim bubble-large bubble-3 scale"></span>
						<span data-anim="anim-bubble-4" class="anim bubble-middle bubble-4 scale"></span>
						<span data-anim="anim-bubble-5" class="anim bubble-middle bubble-5 scale"></span>
						<span data-anim="anim-bubble-6" class="anim bubble-middle bubble-6 scale"></span>
						<span data-anim="anim-bubble-7" class="anim bubble-middle bubble-7 scale"></span>
						<span data-anim="anim-bubble-8" class="anim bubble-small bubble-8 scale"></span>
						<span data-anim="anim-bubble-9" class="anim bubble-small bubble-9 scale"></span>
						<span data-anim="anim-bubble-10" class="anim bubble-small bubble-10 scale"></span>
						<span data-anim="anim-bubble-11" class="anim bubble-small bubble-11 scale"></span>
						<span data-anim="anim-bubble-12" class="anim bubble-small bubble-12 scale"></span>
						<span data-anim="anim-bubble-13" class="anim bubble-small bubble-13 scale"></span>
					</li>
					<li>
						<img class="wallpaper" alt="" src="style/images/wallpaper3_c02363a.jpg" />
						<span data-anim="anim-logo-balloons" class="logo-group logo-g5 logo anim logo-balloons">
							<img alt="" src="style/images/balloons_bd90343.png" />
						</span>
					</li>
					<li class="boxs-item-mask">
						<img class="wallpaper" alt="" src="style/images/wallpaper4_8bbb944.jpg" data-src="http://www.qxllq.com/theme/images/wallpapers/wallpaper4-static_76e7054.jpg" />
						<span class="logo-group logo-g2">
							<span class="logo anim logo-et logo-g2-first">
								<img alt="" src="style/images/et-1_1a9d468.png" />
							</span>
							<span class="logo anim logo-et">
								<img alt="" src="style/images/et-2_172043a.png" />
							</span>
							<span class="logo anim logo-et">
								<img alt="" src="style/images/et-3_2fa36cb.png" />
							</span>
							<span class="logo anim logo-et">
								<img alt="" src="style/images/et-4_4f05e68.png" />
							</span>
							<span class="logo anim logo-et">
								<img alt="" src="style/images/et-5_1dff6cb.png" />
							</span>
							<span class="logo anim logo-et">
								<img alt="" src="style/images/et-6_c85d317.png" />
							</span>
							<span class="logo anim logo-balloon">
								<img alt="" src="style/images/balloon-blue-1_c279c32.png" />
							</span>
							<span class="logo anim logo-balloon">
								<img alt="" src="style/images/balloon-blue-2_e5a4c04.png" />
							</span>
							<span class="logo anim logo-balloon">
								<img alt="" src="style/images/balloon-blue-3_be37480.png" />
							</span>
							<span class="logo anim logo-balloon">
								<img alt="" src="style/images/balloon-blue-4_32a1ad2.png" />
							</span>
							<span class="logo anim logo-balloon">
								<img alt="" src="style/images/balloon-blue-5_12b5193.png" />
							</span>
							<span class="logo anim logo-balloon">
								<img alt="" src="style/images/balloon-blue-6_6106a51.png" />
							</span>
							<span class="logo anim logo-football">
								<img alt="" src="style/images/football_335f428.png" />
							</span>
							<span class="logo anim logo-facebook">
								<img alt="" src="style/images/facebook_f50762e.png" />
							</span>
							<span class="logo anim logo-egg">
								<img alt="" src="style/images/egg_fcddb61.png" />
							</span>
							<span class="logo anim logo-radish">
								<img alt="" src="style/images/radish_140813c.png" />
							</span>
							<span class="logo anim logo-acorn">
								<img alt="" src="style/images/acorn_1b58961.png" />
							</span>
							<span class="logo anim logo-black8">
								<img alt="" src="style/images/black8_a3f3abf.png" />
							</span>
							<span class="logo anim logo-chili">
								<img alt="" src="style/images/chili_ca3755f.png" />
							</span>
							<span class="logo anim logo-eve">
								<img alt="" src="style/images/eve_f93ec62.png" />
							</span>
							<span class="logo anim logo-ladybird">
								<img alt="" src="style/images/ladybird_869ad5b.png" />
							</span>
							<span class="logo anim logo-landmark">
								<img alt="" src="style/images/landmark_324127c.png" />
							</span>
							<span class="logo anim logo-smile">
								<img alt="" src="style/images/smile_cfc607d.png" />
							</span>
						</span>
						<span data-anim="anim-balloon-t" class="anim balloon-t scale"></span>
						<span data-anim="anim-balloon-b" class="anim balloon-b scale"></span>
					</li>
					<li>
						<img class="wallpaper" alt="" src="style/images/wallpaper5_a5bd6fc.jpg" />
						<span data-anim="anim-logo-aircraft" class="logo-group logo-g4 logo anim logo-aircraft">
							<img alt="" src="style/images/aircraft_5323ddf.png" />
						</span>
						<div class="anim aircraft-mountain"></div>
						<div class="anim aircraft-sky"></div>
						<div data-anim="anim-aircraft-stars-front" class="anim aircraft-stars-front"></div>
						<div data-anim="anim-aircraft-stars-behind" class="anim aircraft-stars-behind"></div>
						<span data-anim="anim-meteor-1" class="anim scale meteor meteor-1"></span>
						<span data-anim="anim-meteor-2" class="anim scale meteor meteor-2"></span>
					</li>
					<li>
						<img class="wallpaper" alt="" src="style/images/wallpaper6_6a0ec5b.jpg" />
						<span class="logo-group logo-g6">
							<span class="logo anim logo-blackhole">
								<img alt="" src="style/images/black-hole_c06a63f.png" />
							</span>
							<span data-anim="anim-logo-blackhole-light" class="logo anim logo-blackhole-light">
								<img alt="" src="style/images/black-hole-light_f614fc5.png" />
							</span>
						</span>
						<span data-anim="anim-light-1" class="anim light light-1"></span>
						<span data-anim="anim-light-2" class="anim light light-2"></span>
						<span data-anim="anim-light-3" class="anim light light-3"></span>
						<span data-anim="anim-light-4" class="anim light light-4"></span>
					</li>
				</ul>
				<ul id="desc">
					<li class="desc-item-first">
						<h2><img alt="" src="style/images/title1_b3be7f4.png" /></h2>
						<p>就算是再相同的一天,换一扇窗看出去,都是一个不同的世界,从现在起,打开应用中心,发现更大世界。</p>
					</li>
					<li>
						<h2><img alt="" src="style/images/title7_9d06a23.png" /></h2>
						<p>不知道该做些什么的时候,让崭新的发现功能为你找真爱,每天发现不同的六个网站,虽然很少,但是很好。</p>
					</li>
					<li>
						<h2><img alt="" src="style/images/title2_f5e62e6.png" /></h2>
						<p>千寻想要的设计不是迎合潮流,也不是炫技雕饰,点到为止、干净用心才是最适合上网的设计,上善若水,大巧不工。</p>
					</li>
					<li>
						<h2><img alt="" src="style/images/title3_1646637.png" /></h2>
						<p>能不动就不动的慵懒日子一点也不遥远,在千寻你就做得到,打开几十个网页,看看连续关闭它们有多省事。</p>
					</li>
					<li>
						<h2><img alt="" src="style/images/title4_c4f9380.png" /></h2>
						<p>千寻有个勤快的小秘书每天早早起床为你精选最新的阅读视频和音乐,只用三张网页,给你一整天的超棒内容,我们保证。</p>
					</li>
					<li>
						<h2><img alt="" src="style/images/title5_fd728e0.png" /></h2>
						<p>秒级安装,独家加速下载技术,和更多让上网更快的事情都被千寻带来你身边,三倍四倍,不止快一点,还要更快一点。</p>
					</li>
					<li>
						<h2><img alt="" src="style/images/title6_3a47e8d.png" /></h2>
						<p>网页无法显示真让人抓狂,让云修复穿越时空找它们回来,你看,原先打不开的网站忽然就好了。</p>
					</li>
				</ul>
				<ul id="package-info">
					<li>
						版本:<span class="package-version"></span>
					</li>
					<li>
						大小:<span class="package-size"></span>
					</li>
					<li class="package-info-last">
						更新:<span class="package-release"></span>
					</li>
				</ul>
			</div>
			<div id="sub">
				<div id="aboutus" class="sub-item about">
					<a class="button-down" href="">
						<span class="button-down-icon"></span>
						<span class="button-down-shadow"></span>
					</a>
					<div class="sub-item-wrapper">
						<div class="sub-item-container">
							<h2 class="sub-item-header about-header">
								<span class="sub-item-header-icon"></span>
							</h2>
							<div class="about-content">
								<div style="display: none;">
								<p>蕾拉又去旅行了,产品经理实在是很忙,但是蕾拉总会挤出时间去旅行。她说做一个可爱的人比做一个优秀的人更重要。</p>
								<p>这次蕾拉干掉了她十天的年假去了土耳其,红茶烤肉肚皮舞,回来之后蕾拉兴奋地拿着卡帕多奇亚的照片在办公室里穿梭,照片里她趴在热气球上看日落。</p>
								<p>她抓住嫂子问嫂子嫂子你看赞不赞赞不赞!嫂子激动地说哎呀好美!<br />她抓住晓冬问晓冬晓冬你看赞不赞赞不赞!晓冬震惊地说哎呀好帅!<br />她抓住欧阳问欧阳欧阳你看赞不赞赞不赞!欧阳愁眉苦脸地说哎呀好贵……</p>
								<p>一个月后,嫂子去了土耳其旅行,晓冬也订了去伊斯坦布尔的机票,欧阳从音乐节回来手头有点紧,所以他在谷歌地球里去了一趟棉花堡,我们说蕾拉啊你还真有情怀每次都挑那么好的目的地去旅行,她说我们的时间那么少所以每次旅行选的地方都要最好。</p>
								<p>Lee有一次跟大家讲情怀,说不管你是产品经理还是设计师都要有情怀,这样才能做出好的产品,因为每一个人能看到的东西都是有限的,也许世界上的好地方太多,而大家却只知道一两个,会错过太多的美好,所以我们自己要有情怀要知道很多美丽的地方,才有机会让大家看到更多的美好。我们问Lee你的情怀是怎样的,Lee说是风和日丽的下午躺在小镇木屋的露台上看书,旁边还有个漂亮的姑娘。我们又问这个小镇木屋在哪儿呢,Lee挠着头开始翻目的地攻略,后来他也去了土耳其。</p>
								<p>情怀是安静地坐在热气球上等日落,看山河湖海看大漠莽原,看春暖花开看秋雁南回;情怀是我们知道这些,更想要告诉你。</p>
								<p>写完这期连载,杰西拿给Lee去看,Lee读了两遍说这次的连载和我们这次要上线的发现功能联系好像不紧密要不要改一改,杰西说这就是情怀好么!这就是情怀!</p>
								<p class="about-date">2014.6.19</p>
								<p class="about-content-splitter"></p>
								</div>
								<p>那天在老聂烧烤吃宵夜,Lee问曹大爷页面解析速度能不能快点,曹大爷一口啤酒灌下去说能快,Lee说能不能比快一点更快一点,曹大爷打了个嗝说太快了不能再快了都酒驾了。</p>
								<p>Lee以前住过的房子里,淋浴花洒都只有几十块钱。他说花洒这东西,能喷出水来冲个澡就是够用的,满足了需求性价比自然就高了,他就这么随便冲了许多年的澡。后来Lee的生活奔小康了,朋友说你这个花洒太屌丝你要懂得享受生活,就给他介绍了个像样的的牌子,让Lee不情愿地买了一个六百多块的花洒。六百多块买到的是多好的花洒啊,出水细腻,水量均匀有力,还能稳定温度,Lee当天晚上冲澡的时候整个世界观都崩塌了,从那天起他觉得在家冲个澡是除去在会议室和设计师拍桌叫板以外最痛快的事,对了,还要除去在老聂烧烤吃宵夜。</p>
								<p>第二天Lee就跑来找我们吃烧烤,满口鸡翅地说:我现在知道了不凑合是多么崭新的体验,比好更好一点也许要花去不少代价,但却能换来一个不同的世界,我们要做一些比好更好的东西,要让每一个人都发现一个不同的世界。</p>
								<p>后来我们花了一些时间来制作千寻,再后来浏览器就是我们在烧烤摊上最大的话题。这群人里有来自硅谷却充满哲学气息的科学家,有打羽毛球和打代码一样找不出漏洞的工程师,有狂热痴迷热干面的海归产品经理,有刚毕业的高品位美少女运营专员,还有技能树点满的交互奶爸和爱吃草莓的HighFasion视觉姑娘。这是个普通又有趣的队伍,普通到职位配置就像教科书一样标准,有趣到人人都打了鸡血一样的充满干劲,我们觉得这太棒了。</p>
								<p>互联网是如此的大,以至于我们上网的时间再长也只能见冰山一角,收藏的网站再多也总是不知道该看什么,我们正在试图抓住一个机会给大家推开一扇新的窗,发现一个崭新的,更好一点却完全不同世界,我们觉得这是一件美好的事情。</p>
								<p>敬老聂烧烤。<br>敬那只花洒。</p>
								<p class="about-date">2014.5.20</p>
							</div>
							<p class="about-footer">
							</p>
						</div>
					</div>
				</div>
				<div id="update" class="sub-item log">
					<a class="button-down" href="">
						<span class="button-down-icon"></span>
						<span class="button-down-shadow"></span>
					</a>
					<div class="sub-item-wrapper">
						<div class="sub-item-container">
							<h2 class="sub-item-header log-header">
								<span class="sub-item-header-icon"></span>
							</h2>
							<div class="log-content">
								<div class="log-begin">
									<span class="log-begin-icon"></span>
									<span class="log-begin-icon-light"></span>
									<span class="log-begin-icon-overlay"></span>
									<span class="log-begin-text">下一个新高度</span>
								</div>
								<div class="log-box log-left-box">
									<span class="log-box-icon"></span>
									<div class="log-box-top">
										<div class="log-box-top-inner"></div>
									</div>
									<div class="log-box-content">
										<div class="log-box-content-inner">
											<h3>
												千寻浏览器 1.0 Beta3<span class="log-date">2014/07/31</span>
											</h3>
											<h4>新功能:</h4>
											<ol>
												<li>
													<span class="log-box-item-no">1.</span>
													<div class="log-box-item-content">
														极速内核:安装核心组件(极速内核)后可开启应用中心并大幅提升网页浏览速度
													</div>
												</li>
												<li>
													<span class="log-box-item-no">2.</span>
													<div class="log-box-item-content">
														应用中心:提供微信网页版、宝石迷阵、如意淘、追书神器等多款精选应用
													</div>
												</li>
											</ol>
											<h4>体验优化:</h4>
											<ol>
												<li>
													<span class="log-box-item-no">1.</span>
													<div class="log-box-item-content">
														工具栏新增收藏按钮,在收藏栏隐藏时也能快速找到收藏
													</div>
												</li>
												<li>
													<span class="log-box-item-no">2.</span>
													<div class="log-box-item-content">
														导入收藏新增对火狐浏览器和Opera浏览器的支持
													</div>
												</li>
												<li>
													<span class="log-box-item-no">3.</span>
													<div class="log-box-item-content">
														优化了历史记录的时间格式,采用24小时制时间格式,查看记录更加方便
													</div>
												</li>
												<li>
													<span class="log-box-item-no">4.</span>
													<div class="log-box-item-content">
														优化了地址栏自动联想匹配原则,网址自动补全更加智能
													</div>
												</li>
											</ol>
										</div>
									</div>
									<div class="log-box-bottom">
										<div class="log-box-bottom-inner"></div>
									</div>
								</div>
								<div id="log-4" class="log-box log-right-box">
									<span class="log-box-icon"></span>
									<div class="log-box-top">
										<div class="log-box-top-inner"></div>
									</div>
									<div class="log-box-content">
										<div class="log-box-content-inner">
											<h3>
												千寻浏览器 1.0 Beta2(759)<span class="log-date">2014/07/03</span>
											</h3>
											<h4>新功能:</h4>
											<ol>
												<li>
													<span class="log-box-item-no">1.</span>
													<div class="log-box-item-content">
														智能升级IE内核:Win7环境下可将内核静默升级至IE10
													</div>
												</li>
												<li>
													<span class="log-box-item-no">2.</span>
													<div class="log-box-item-content">
														分享发现的网站时可显示来自“千寻浏览器”并自动@千寻浏览器
													</div>
												</li>
											</ol>
											<h4>体验优化:</h4>
											<ol>
												<li>
													<span class="log-box-item-no">1.</span>
													<div class="log-box-item-content">
														双击启动速度提升10%
													</div>
												</li>
											</ol>
											<h4>问题修复:</h4>
											<ol>
												<li>
													<span class="log-box-item-no">1.</span>
													<div class="log-box-item-content">
														修复窗口高度小于700px时发现功能的网站介绍无法显示的问题
													</div>
												</li>
												<li>
													<span class="log-box-item-no">2.</span>
													<div class="log-box-item-content">
														修复发现图标在标签页和收藏栏上显示不清晰的问题
													</div>
												</li>
												<li>
													<span class="log-box-item-no">3.</span>
													<div class="log-box-item-content">
														修复发现页面部分色块色值不一致的问题
													</div>
												</li>
												<li>
													<span class="log-box-item-no">4.</span>
													<div class="log-box-item-content">
														修复发现功能频繁出现网络异常的问题
													</div>
												</li>
											</ol>
										</div>
									</div>
									<div class="log-box-bottom">
										<div class="log-box-bottom-inner"></div>
									</div>
								</div>
								<div id="log-3" class="log-box log-left-box">
									<span class="log-box-icon"></span>
									<div class="log-box-top">
										<div class="log-box-top-inner"></div>
									</div>
									<div class="log-box-content">
										<div class="log-box-content-inner">
											<h3>
												千寻浏览器 1.0 Beta2<span class="log-date">2014/06/19</span>
											</h3>
											<h4>新功能:</h4>
											<ol>
												<li>
													<span class="log-box-item-no">1.</span>
													<div class="log-box-item-content">
														发现:依托百度大数据,新增浏览器业界史无前例的“发现”功能
													</div>
												</li>
												<li>
													<span class="log-box-item-no">2.</span>
													<div class="log-box-item-content">
														智能升级IE内核:WinXP环境下可将内核静默升级至IE8
													</div>
												</li>
											</ol>
											<h4>体验优化:</h4>
											<ol>
												<li>
													<span class="log-box-item-no">1.</span>
													<div class="log-box-item-content">
														优化浏览器基础性能:卡死和假死率降低
													</div>
												</li>
												<li>
													<span class="log-box-item-no">2.</span>
													<div class="log-box-item-content">
														大幅提升广告拦截能力:采用独家拦截策略,无论是弹窗广告、动画广告还是侧边广告,一个都不放过!
													</div>
												</li>
												<li>
													<span class="log-box-item-no">3.</span>
													<div class="log-box-item-content">
														增加导入收藏支持的浏览器:可导入百度浏览器、QQ浏览器收藏
													</div>
												</li>
												<li>
													<span class="log-box-item-no">4.</span>
													<div class="log-box-item-content">
														优化了记住密码填充规则,匹配更加精确
													</div>
												</li>
												<li>
													<span class="log-box-item-no">5.</span>
													<div class="log-box-item-content">
														新增关闭标签页后可智能切换到关联的标签页
													</div>
												</li>
												<li>
													<span class="log-box-item-no">6.</span>
													<div class="log-box-item-content">
														新增支持鼠标滚轮(或Ctrl+Tab)在标签页间循环切换
													</div>
												</li>
												<li>
													<span class="log-box-item-no">7.</span>
													<div class="log-box-item-content">
														新增登录、登出、设默成功等操作的反馈
													</div>
												</li>
											</ol>
											<h4>问题修复:</h4>
											<ol>
												<li>
													<span class="log-box-item-no">1.</span>
													<div class="log-box-item-content">
														修复拖拽标签引发的崩溃问题
													</div>
												</li>
												<li>
													<span class="log-box-item-no">2.</span>
													<div class="log-box-item-content">
														修复多处内存泄漏问题
													</div>
												</li>
												<li>
													<span class="log-box-item-no">3.</span>
													<div class="log-box-item-content">
														修复QQ空间无法播放音乐的问题
													</div>
												</li>
												<li>
													<span class="log-box-item-no">4.</span>
													<div class="log-box-item-content">
														修复虾米音乐无法播放的问题
													</div>
												</li>
												<li>
													<span class="log-box-item-no">5.</span>
													<div class="log-box-item-content">
														修复最近关闭列表中的云修复页面无法显示提示的问题
													</div>
												</li>
												<li>
													<span class="log-box-item-no">6.</span>
													<div class="log-box-item-content">
														修复部分特殊网址卡死的问题
													</div>
												</li>
												<li>
													<span class="log-box-item-no">7.</span>
													<div class="log-box-item-content">
														修复地址栏联想时间较长的问题
													</div>
												</li>
												<li>
													<span class="log-box-item-no">8.</span>
													<div class="log-box-item-content">
														修复其他界面上的缺陷
													</div>
												</li>
											</ol>
										</div>
									</div>
									<div class="log-box-bottom">
										<div class="log-box-bottom-inner"></div>
									</div>
								</div>
								<div id="log-2" class="log-box log-right-box">
									<span class="log-box-icon"></span>
									<div class="log-box-top">
										<div class="log-box-top-inner"></div>
									</div>
									<div class="log-box-content">
										<div class="log-box-content-inner">
											<h3>
												千寻浏览器 1.0 Beta1(524)<span class="log-date">2014/05/27</span>
											</h3>
											<ol>
												<li>
													<span class="log-box-item-no">1.</span>
													<div class="log-box-item-content">
														<span>去除内测邀请码限制</span>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">2.</span>
													<div class="log-box-item-content">
														<span>修复了收藏夹导入引起的崩溃</span>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">3.</span>
													<div class="log-box-item-content">
														<span>修复了IE10和IE11环境下F12引起的崩溃</span>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">4.</span>
													<div class="log-box-item-content">
														<span>修复了设为默认浏览器回调时引起的崩溃</span>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">5.</span>
													<div class="log-box-item-content">
														<span>修复了Win8系统下千寻不在选择默认浏览器列表中的问题</span>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">6.</span>
													<div class="log-box-item-content">
														<span>修复了localhost被误判为非法的问题</span>
													</div>
												</li>
											</ol>
										</div>
									</div>
									<div class="log-box-bottom">
										<div class="log-box-bottom-inner"></div>
									</div>
								</div>
								<div id="log-1" class="log-box log-left-box">
									<span class="log-box-icon"></span>
									<div class="log-box-top">
										<div class="log-box-top-inner"></div>
									</div>
									<div class="log-box-content">
										<div class="log-box-content-inner">
											<h3>
												千寻浏览器 1.0 Beta1<span class="log-date">2014/05/20</span>
											</h3>
											<ol>
												<li>
													<span class="log-box-item-no">1.</span>
													<div class="log-box-item-content">
														<strong>超轻超快:1秒安装,半秒冷启,3倍加速</strong>
														<p>5M超小安装包,1秒安装,0.5秒冷启动,并独享百度云加速,下载速度提升三倍。</p>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">2.</span>
													<div class="log-box-item-content">
														<strong>极简设计:突出网页内容,最大化网页浏览面积</strong>
														<p>界面采用扁平化设计,选取无彩色系中的黑、白、灰作为色彩基调,弱化界面存在感,突出丰富多彩的网页内容,最大化浏览面积。</p>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">3.</span>
													<div class="log-box-item-content">
														<strong>懒人标签:节省关闭标签页的时间,减少误关闭操作</strong>
														<p>打开多个网页,鼠标无需移动位置即可连续关闭;滑动鼠标滚轮,即可在多个标签之间自由切换,杜绝误关闭。</p>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">4.</span>
													<div class="log-box-item-content">
														<strong>网页云修复:修复部分无法打开的网页</strong>
														<p>部分无法打开的网页,千寻可在云端即时修复,修复后的网页可正常浏览。</p>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">5.</span>
													<div class="log-box-item-content">
														<strong>网址安全:拦截欺诈和钓鱼网站</strong>
														<p>接入最全面的网址安全联盟数据库,超强拦截欺诈和钓鱼网站,全力为您的上网安全保驾护航。</p>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">6.</span>
													<div class="log-box-item-content">
														<strong>医疗安全:鉴别医疗网站真实性</strong>
														<p>接入中国最全面的医疗数据库,地址栏可直达医院资质认证信息,不必再担心访问到虚假医疗网站。 </p>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">7.</span>
													<div class="log-box-item-content">
														<strong>隐身窗口:上网不留痕</strong>
														<p>搜索、访问不会产生历史记录,关闭隐身窗口自动清空缓存,贴心保护您的上网隐私。</p>
													</div>
												</li>
												<li>
													<span class="log-box-item-no">8.</span>
													<div class="log-box-item-content">
														<strong>全面基础功能:零学习成本</strong>
														<p>具备收藏夹同步、鼠标手势、智能地址栏联想、广告拦截、网址导航等上网必备功能,安装好即可马上使用。</p>
													</div>
												</li>
											</ol>
										</div>
									</div>
									<div class="log-box-bottom">
										<div class="log-box-bottom-inner"></div>
									</div>
								</div>
								<div class="log-end">
									<span class="log-end-icon"></span>
									<span class="log-end-text">千寻升空  <span class="log-date">2014.05.20</span></span>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div id="faq" class="sub-item guide">
					<a class="button-down" href="">
						<span class="button-down-icon"></span>
						<span class="button-down-shadow"></span>
					</a>
					<div class="sub-item-wrapper">
						<div class="sub-item-container">
							<h2 class="sub-item-header guide-header">
								<span class="sub-item-header-icon"></span>
							</h2>
							<div class="guide-content">
								<div class="guide-search">
									<input type="text" class="guide-search-input" name="keywords" placeholder="请输入问题关键词" />
									<button type="button" class="guide-search-button"><span class="guide-search-icon"></span></button>
								</div>
								<dl class="guide-list">
									<dt>Q:为什么要使用千寻浏览器?</dt>
									<dd>
										A:当然,千寻浏览器是一款气质优雅、功能强大的浏览器。千寻率先将扁平式极简化设计带入浏览器领域;首创网页云修复(可强力修复其他浏览器打不开的网页)、懒人标签、云加速下载、医疗医药安全等给力功能;打开浏览器就能看到狂热小编7*24小时为你送上最搞笑、最热门、最有趣的内容。所有的努力都力求为大家打造一款聪明,有趣,好用的浏览器。
										<img alt="" width="700" src="style/images/faq-1_69e62bd.png" />
									</dd>
									<dt>Q:千寻的设计师怎么描述千寻和千寻的logo?</dt>
									<dd>A:寻,追寻,探索,又是古代单位,八尺为一寻。千寻,形容极高或极远,亦指勇于探索,不断发现的精神。每一次浏览体验,都是一次精彩的旅程,刺激、新奇、有趣,乘热气球飞行是探险家、旅游爱好者向往的旅行方式,随着高度的上升,视野不断扩大,与千寻的寻找发现、高度寓意相契合。热气球带我们发现世界,千寻给我们一个有趣的开始。</dd>
									<dt>Q:千寻的小编是美女么?运营了什么内容?</dt>
									<dd>
										A:那还用说。小编每日9点为大家准时更新优质内容,集结搞笑段子、深度问答、热门大片儿、最酷歌单、新锐歌手,让你一饱眼福!
										<img alt="" width="700" src="style/images/faq-3_3c26139.png" />
									</dd>
									<dt>Q:什么是懒人标签?我该如何使用?</dt>
									<dd>
										A:呐,懒人标签是让你高效办公的助力神器。当你打开超多标签页时,只要在关闭按钮处快速连击,即可关闭全部打开的网页,在这个过程中你的鼠标根本无需移动。当然,你也可以试试滑动鼠滚轮,就能快速切换标签页。省去从一堆网页逐次点击关闭的繁琐步骤,让你的办公效率火箭提升!
										<img alt="" width="700" src="style/images/faq-4-1_009573f.png" />
									</dd>
									<dt>Q:隐身窗口模式真的能隐身么?</dt>
									<dd>
										A:当然不是把你变没。在你访问私密网站时,千寻就像个小秘书,贴心提醒你提醒进入隐身窗口模式,防止历史记录等相关功能记录你的私密信息,小秘密再也不怕被老婆发现!
										<img alt="" width="700" src="style/images/faq-5_06255f5.png" />
									</dd>
									<dt>Q:千寻云加速下载能有多快?</dt>
									<dd>
										A:千寻首创云加速下载技术,下载PDF、EXE等文件全网最快。秒速下载百度资源,怎么用你懂的~~
										<img alt="" width="700" src="style/images/faq-6_e0595e1.png" />
									</dd>
									<dt>Q:千寻真的能鉴定医疗安全么?</dt>
									<dd>
										千寻联合百度杀毒与安全联盟大数据资源,提供医疗机构安全认证铭牌,为用户就医询医提供客观参考。
										<img alt="" width="700" src="style/images/faq-7_95b0548.png" />
									</dd>
									<dt>Q:网页云修复真的能修复网页么?我能试试么?</dt>
									<dd>
										请尝试用千寻浏览器打开如下404链接:<a href="http://www.yuhang.gov.cn/class/class_807/articles/335460.html" target="_blank">http://www.yuhang.gov.cn/class/class_807/articles/335460.html</a>,立见分晓,效果如下:
										<img alt="" width="700" src="style/images/faq-8_1c7c383.png" />
									</dd>
									<dt id="mdb">Q:我尝试设置千寻为默认浏览器,失败了怎么办?</dt>
									<dd>
										A:请检查你的电脑里是否有安装过360安全卫士、金山卫士、QQ电脑管家、百度卫士、猎豹浏览器等锁定默认浏览器功能的软件,并手动修改默认。详情请见<a href="http://bbs.qxllq.com/forum.php?mod=viewthread&tid=38" target="_blank">http://bbs.qxllq.com/forum.php?mod=viewthread&tid=38</a>
									</dd>
									<dt id="dnt">Q:什么是DNT(防追踪)功能?</dt>
									<dd>A:DNT(Do Not Track)汉译即为防追踪。在你浏览网页时,网站和供应商正在默默收集你的点击行为、购买记录、搜索请求等行为,使用Do Not Track可有效保护你的隐私,减少广告干扰。</dd>
									<dt>Q:使用千寻,我该注意哪些法律事项?</dt>
									<dd>A:当然,使用千寻我们还有一些必要的许可协议你可以大声朗诵:如<a id="ueo" href="ueo.html" target="_blank">《用户体验改善计划》</a>和<a id="protocol" href="protocol.html" target="_blank">《用户使用许可协议》</a>。</dd>
								</dl>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 滚动切换 滚动条切换 滑动选项卡 滑动切换 选项卡切换 选项卡 切换 tab切换 页面切换 选项卡插件 切换插件 滑动手风琴 全屏焦点图 全屏切换 宽屏全屏 宽屏 全屏 页面全屏 页面宽屏 图片全屏 图片切换 图片选项卡 图标选项卡 选项卡自动切换

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到