impress.js高级特效展示适用于个人介绍超级酷炫资源-CSDN下载

共6个文件

eot：3个

htm：1个

css：1个

impress.js

需积分: 50 105 浏览量 2017-12-05 19:25:14 上传评论收藏 114KB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

demo.rar （6个子文件）

demo

impress.js.pagespeed.jm.J1W2agOVUy.js 10KB

fonts.gstatic.com

ptsans

S1YQx4pVZa17uu0HWQd2fA.eot 49KB

opensans

v13

cJZKeOuBrn4kERxqtaUH3fY6323mHUZFJMgTvxaG2iE.eot 18KB

ptserif

0Om6Iw1e323HjeZHy8W4rfesZW2xOQ-xsNqO47m55DA.eot 37KB

index.htm 10KB

css

A.info.css+fonts.css,Mcc.3oeLZa5OjE.css.pagespeed.cf.eMOlhcLhLT.css 10KB

<!doctype html> <html lang="zh-CN"> <head> <meta charset=utf-8 "utf-8"/> <meta name="viewport" content="width=1024" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta http-equiv=refresh content= /> <title>关于我 |Dreamer</title> <meta name="author" content="tim" /> <script data-pagespeed-no-defer> function fresh() { if(location.href.indexOf("?reload=true")<0) { location.href+="?reload=true"; } } setTimeout("fresh()",50) (function() { function d(b) { var a = window; if(a.addEventListener) a.addEventListener("load", b, !1); else if(a.attachEvent) a.attachEvent("onload", b); else { var c = a.onload; a.onload = function() { b.call(this); c && c.call(this) } } } var p = Date.now || function() { return +new Date }; window.pagespeed = window.pagespeed || {}; var q = window.pagespeed; function r() { this.a = !0 } r.prototype.c = function(b) { b = parseInt(b.substring(0, b.indexOf(" ")), 10); return !isNaN(b) && b <= p() }; r.prototype.hasExpired = r.prototype.c; r.prototype.b = function(b) { return b.substring(b.indexOf(" ", b.indexOf(" ") + 1) + 1) }; r.prototype.getData = r.prototype.b; r.prototype.f = function(b) { var a = document.getElementsByTagName("script"), a = a[a.length - 1]; a.parentNode.replaceChild(b, a) }; r.prototype.replaceLastScript = r.prototype.f; r.prototype.g = function(b) { var a = window.localStorage.getItem("pagespeed_lsc_url:" + b), c = document.createElement(a ? "style" : "link"); a && !this.c(a) ? (c.type = "text/css", c.appendChild(document.createTextNode(this.b(a)))) : (c.rel = "stylesheet", c.href = b, this.a = !0); this.f(c) }; r.prototype.inlineCss = r.prototype.g; r.prototype.h = function(b, a) { var c = window.localStorage.getItem("pagespeed_lsc_url:" + b + " pagespeed_lsc_hash:" + a), f = document.createElement("img"); c && !this.c(c) ? f.src = this.b(c) : (f.src = b, this.a = !0); for(var c = 2, k = arguments.length; c < k; ++c) { var g = arguments[c].indexOf("="); f.setAttribute(arguments[c].substring(0, g), arguments[c].substring(g + 1)) } this.f(f) }; r.prototype.inlineImg = r.prototype.h; function t(b, a, c, f) { a = document.getElementsByTagName(a); for(var k = 0, g = a.length; k < g; ++k) { var e = a[k], m = e.getAttribute("data-pagespeed-lsc-hash"), h = e.getAttribute("data-pagespeed-lsc-url"); if(m && h) { h = "pagespeed_lsc_url:" + h; c && (h += " pagespeed_lsc_hash:" + m); var l = e.getAttribute("data-pagespeed-lsc-expiry"), l = l ? (new Date(l)).getTime() : "", e = f(e); if(!e) { var n = window.localStorage.getItem(h); n && (e = b.b(n)) } e && (window.localStorage.setItem(h, l + " " + m + " " + e), b.a = !0) } } } function u(b) { t(b, "img", !0, function(a) { return a.src }); t(b, "style", !1, function(a) { return a.firstChild ? a.firstChild.nodeValue : null }) } q.i = function() { if(window.localStorage) { var b = new r; q.localStorageCache = b; d(function() { u(b) }); d(function() { if(b.a) { for(var a = [], c = [], f = 0, k = p(), g = 0, e = window.localStorage.length; g < e; ++g) { var m = window.localStorage.key(g); if(!m.indexOf("pagespeed_lsc_url:")) { var h = window.localStorage.getItem(m), l = h.indexOf(" "), n = parseInt(h.substring(0, l), 10); if(!isNaN(n)) if(n <= k) { a.push(m); continue } else if(n < f || 0 == f) f = n; c.push(h.substring(l + 1, h.indexOf(" ", l + 1))) } } k = ""; f && (k = "; expires=" + (new Date(f)).toUTCString()); document.cookie = "_GPSLSC=" + c.join("!") + k; g = 0; for(e = a.length; g < e; ++g) window.localStorage.removeItem(a[g]); b.a = !1 } }) } }; q.localStorageCacheInit = q.i; })(); pagespeed.localStorageCacheInit(); </script> <link href="css/A.info.css+fonts.css,Mcc.3oeLZa5OjE.css.pagespeed.cf.eMOlhcLhLT.css" rel="stylesheet" /> <link rel="shortcut icon" /> <link rel="apple-touch-icon" href="apple-touch-icon.png" /> <base target="_blank"> </head> <body class="impress-not-supported"> <div class="fallback-message"> <p>您的浏览器 <b>不支持</b> impress.js的展示要求, 将为您呈现简化版的展示</p> <p>为了获取最佳效果，请使用最新版的<b>Chrome</b>, <b>Safari</b> 或 <b>Firefox</b> 浏览器</p> <p>请使用电脑端食用，效果更佳，记得摇一摇哟！</p> </div> <div id="impress"> <div id="welcome" class="step" data-x="-2000" data-y="-2500"> <p>欢迎来到</p> <p><span class="title"><b>Dreamer</b></span></p> <p><span class="footnote"><sup>*</sup>我叫<span class="name"> GaoWei</span>，下面是关于我的一些介绍</span> </p> </div> <div id="me" class="step" data-x="0" data-y="-2500"> <b class="now_me">现在的我：</b> <ul> <li><b class="ios">一名大三理工男</b></li> <li><b class="unity">未来的职业程序猿一名</b></li> <li><b class="ios">业余前端开发者</b></li> <li><b class="photo">业余建站爱好者</b></li> </ul> </div> <div id="whereiam" class="step" data-x="850" data-y="3000" data-rotate="90" data-scale="3"> <p>生于<span class="kunming">安徽</span></p> <p><span class="born">一个不起眼的小农村</span></p> <p>就读<span class="tsinghua">桂林理工</span></p> <p><span class="study">麻雀虽小五脏俱全</span></p> </div> <div id="guilin" class="step" data-x="3500" data-y="2100" data-rotate="180" data-scale="4"> <p>现就读于<b class="trans">桂林</b> <p> <p>努力学习本专业<sup>*</sup>的同时，也在不断学习新的东西<sup>**</sup></p> <p><span class="footnote">* 其实就是玩手机，** 然后就是发呆</span></p> </div> <div id="world" class="step" data-x="-100" data-y="2900" data-z="900" data-rotate="-90" data-scale="5"> <p>有时候会觉得，世界真的很小</p> </div> <div id="meet" class="step" data-x="1300" data-y="6000" data-z="2400" data-scale="6"> <p>也许我们就在某时某地</p> <p>曾经擦肩而过</p> <p>而你我，却浑然不觉</p> </div> <div id="tiny" class="step" data-x="1300" data-y="6000" data-z="-3000" data-rotate="300" data-scale="1"> <p>但是</p> </div> <div id="comein" class="step" data-x="0" data-y="7000" data-z="-3000" data-rotate="300"> <p>从此刻开始，从您踏入 <a href="http://www.aoeiun.cn/">Dreamer</a>开始</p> <p>我们的生活便有了<b>交集</b></p> </div> <div id="mywords" class="step" data-x="4500" data-y="3500" data-z="3000" data-rotate="160"> <p>也许您在这里能看到的只是</p> <p>中国千千万万理工男之中最普通的一员</p> <p>所写下的最蹩足的文字</p> </div> <div id="grow" class="step" data-x="3500" data-y="-850" data-z="3000" data-rotate="270" data-scale="6"> <p>但我相信它们真实地记载了</p> <p><b>我的生活，我的成长</b></p> </div> <div id="knowme" class="step" data-x="-6000" data-y="-800" data-z="0" data-rotate="0" data-scale="1"> <p>正如</p> <p>伯乐得见绝世好马，子期终遇伯牙佳音</p> </div> <div id="prizeme" class="step" data-x="-6000" data-y="-500" data-z="-500" data-rotate-x="-40" data-rotate-y="10" data-scale="2"> <p><span class="horse">良驹美景，</span> <span class="moutain">高山流水�

评论收藏

内容反馈