qq主页面
来源：互联网 发布：注册淘宝号 编辑：程序博客网 时间：2024/06/11 07:01
<style type="text/css"> * { margin: 0; padding: 0; list-style-type: none; } a, img { border: 0; } #move_div { position: absolute; width: 430px; height: 330px; border: solid 1px #EBF2F9; } #bottom { width: 430px; height: 148px; position: absolute; background-color: #EBF2F9; } #tx { position: absolute; width: 80px; height: 80px; margin-left: 43px; margin-top: 12px; /*border: solid 1px black;*/ border-radius: 5px; } #tx img{ width:80px; height: 75px; } #QQ { margin-left: 135px; margin-top: 12px; } #QQ input { font-size: 13px; line-height: 20px; outline: none; width: 193px; height: 30px; border-radius: 5px; border: solid 1px gainsboro; text-indent: 4px; } #QQ input:hover { border: solid 1px dodgerblue; } #QQ a { font-size: 12px; text-decoration: none; color: #2685E3; font-family: "微软雅黑"; } #QQ a:hover { opacity: 0.5 } #dl { width: 193px; height: 30px; background-color: dodgerblue; outline: none; border: none; font-size: 12px; color: white; border-radius: 4px; display: block; margin-top: 32px; font-family: "微软雅黑"; } #dl:hover { background-color: #3CC3F5; } .min { width: 27px; height: 27px; /*border: 1px solid red;*/ position: absolute; right: 27px; top: 0px; z-index: 110; } .min2 { width: 27px; height: 27px; line-height: 27px; text-align: center; position: absolute; right: 27px; top: 4px; z-index: 110; color: white; } .min:hover { cursor: default; background-color: #FFFFFF; opacity: 0.3; -moz-opacity: 0.3; } .tz{ position: absolute; top: 0px; left: 0px; width: 100%; height: 100px; z-index: 100; } .tz:hover{ cursor: move; } .min_div{ position: absolute; bottom:5px ; left: 5px; width: 150px; height: 30px; background-color:#0096ED; line-height: 30px; text-align: center; color: #FFFFFF; display: none; } .min_div:hover{ cursor: pointer; opacity: 0.8; } .closeLogin { position: absolute; right: 0px; top: 0px; width: 27px; height: 27px; z-index: 110; font-size: 19px; } .closeLogin2 { position: absolute; right: 0px; top: 0px; width: 27px; height: 27px; font-size: 19px; color: white; text-align: center; line-height: 27px; } .closeLogin:hover { cursor: default; filter: Alpha(opacity=30); /*border: 1px solid #FFFFFF;*/ background-color: red; opacity: 0.8; } .showLogin { font-family: "宋体"; width: 88px; height: 88px; /*border: 1px solid red;*/ } /*.showLogin:hover{ background-color: dodgerblue; opacity: 0.2; }*/ .showLogin img { margin-top: 2px; width: 60px; height: 60px; margin-left: 12px; } #check{ width: 10px; height: 10px; } .ccc{ position: absolute; margin-left: -30px; margin-top: 7px; } .ddd{ /*border: 1px solid black;*/ position: absolute; color: gray; font-size:13px; font-family: "微软雅黑"; margin-left:30px; margin-top:3px ; } .remember{ position: absolute; margin-left: 75px; margin-top: 7px; } .eee{ /*border: 1px solid black;*/ position: absolute; color: gray; font-size:13px; font-family: "微软雅黑"; margin-left:135px; margin-top:3px ; }</style><script> var move_div, min_div; window.onload = function() { move_div = document.getElementById("move_div"); min_div = document.getElementById("min_div"); } //显示登录窗口 function showLogin() { move_div.style.display = "block" } //登录窗口最小化 function minLogin(){ move_div.style.display = "none"; min_div.style.display = "block"; } //登录窗口最大化 function maxLogin(){ move_div.style.display = "block"; min_div.style.display = "none"; } //关闭窗口 function closeLogin() { move_div.style.display = "none"; }</script><script type="text/javascript" src="js/js/move.js" ></script><script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
登录
<div class="closeLogin" onclick="closeLogin()"></div><div id="move_div" onmousedown="down()" onmouseup="up()" onmousemove="move()"> <!--实现拖拽--> <div class="tz"></div> <!--上半部分蓝色动态图--> <div id="container" style="width:430px;height:182px;"> <!--<span id="bigQQ" style="font-size: 60px;"> QQ </span>--> <div class="min2"> <font style="font-size: 17px;font-weight: 900px;">－</font> </div> <div class="min" onclick="minLogin()"></div> <div class="closeLogin2"> <font style="font-size:22px;">×</font> </div> <div class="closeLogin" onclick="closeLogin()"></div> <div id="anitOut"></div> </div> <!--下半部分选项等--> <div id="bottom"> <div id="tx"> <img src="img/img/news_default_AF2F541937CE17C5F3C7A0819D5BEBE8.jpg"/> </div> <div id="QQ"> <input type="text" value="149772262"/> <a href="https://ssl.zc.qq.com/v3/index-chs.html?from=client&pt_clientver=5539&pt_src=1&ptlang=2052®key=4B0AE3ED88DFC374570559FD92BEC59C3A8FD333343989A73CE98FD31949E79E&ADUIN=0&ADSESSION=0&ADTAG=CLIENT.QQ.5539_NewAccount_Btn.0&ADPUBNO=26730"> 注册账号</a><br /> <input type="password" placeholder=" 密码" onfocus="this.placeholder=''" onblur="this.placeholder=' 密码'" /> <a href="https://aq.qq.com/v2/uv_aq/html/reset_pwd/pc_reset_pwd_input_account.html?v=4.0&old_ver_account=149772262"> 找回密码</a><br /> <div class="ccc"> <input type="checkbox" name="vehicle" value="Bike" style="zoom: 50%;"> </div> <font class="ddd">自动登录</font> <div class="remember"> <input type="checkbox" name="vehicle" value="Bike" style="zoom: 50%;"> </div> <font class="eee">记住密码</font> <button id="dl">登 录</button> </div> </div></div><script type="text/javascript"> $(function() { if(!window.ActiveXObject && !!document.createElement("canvas").getContext) { $.getScript("http://im-img.qq.com/pcqq/js/200/cav.js?_=1428576021379", function() { var t = { width: 1.5, height: 1.5, depth: 10, segments: 12, slices: 6, xRange: 0.8, yRange: 0.1, zRange: 1, ambient: "#525252", diffuse: "#FFFFFF", speed: 0.0002 }; var G = { count: 2, xyScalar: 1, zOffset: 100, ambient: "#002c4a", diffuse: "#005584", speed: 0.001, gravity: 1200, dampening: 0.95, minLimit: 10, maxLimit: null, minDistance: 20, maxDistance: 400, autopilot: false, draw: false, bounds: CAV.Vector3.create(), step: CAV.Vector3.create(Math.randomInRange(0.2, 1), Math.randomInRange(0.2, 1), Math.randomInRange(0.2, 1)) }; var m = "canvas"; var E = "svg"; var x = { renderer: m }; var i, n = Date.now(); var L = CAV.Vector3.create(); var k = CAV.Vector3.create(); var z = document.getElementById("container"); var w = document.getElementById("anitOut"); var D, I, h, q, y; var g; var r; function C() { F(); p(); s(); B(); v(); K(z.offsetWidth, z.offsetHeight); o() } function F() { g = new CAV.CanvasRenderer(); H(x.renderer) } function H(N) { if(D) { w.removeChild(D.element) } switch(N) { case m: D = g; break } D.setSize(z.offsetWidth, z.offsetHeight); w.appendChild(D.element) } function p() { I = new CAV.Scene() } function s() { I.remove(h); D.clear(); q = new CAV.Plane(t.width * D.width, t.height * D.height, t.segments, t.slices); y = new CAV.Material(t.ambient, t.diffuse); h = new CAV.Mesh(q, y); I.add(h); var N, O; for(N = q.vertices.length - 1; N >= 0; N--) { O = q.vertices[N]; O.anchor = CAV.Vector3.clone(O.position); O.step = CAV.Vector3.create(Math.randomInRange(0.2, 1), Math.randomInRange(0.2, 1), Math.randomInRange(0.2, 1)); O.time = Math.randomInRange(0, Math.PIM2) } } function B() { var O, N; for(O = I.lights.length - 1; O >= 0; O--) { N = I.lights[O]; I.remove(N) } D.clear(); for(O = 0; O < G.count; O++) { N = new CAV.Light(G.ambient, G.diffuse); N.ambientHex = N.ambient.format(); N.diffuseHex = N.diffuse.format(); I.add(N); N.mass = Math.randomInRange(0.5, 1); N.velocity = CAV.Vector3.create(); N.acceleration = CAV.Vector3.create(); N.force = CAV.Vector3.create() } } function K(O, N) { D.setSize(O, N); CAV.Vector3.set(L, D.halfWidth, D.halfHeight); s() } function o() { i = Date.now() - n; u(); M(); requestAnimationFrame(o) } function u() { var Q, P, O, R, T, V, U, S = t.depth / 2; CAV.Vector3.copy(G.bounds, L); CAV.Vector3.multiplyScalar(G.bounds, G.xyScalar); CAV.Vector3.setZ(k, G.zOffset); for(R = I.lights.length - 1; R >= 0; R--) { T = I.lights[R]; CAV.Vector3.setZ(T.position, G.zOffset); var N = Math.clamp(CAV.Vector3.distanceSquared(T.position, k), G.minDistance, G.maxDistance); var W = G.gravity * T.mass / N; CAV.Vector3.subtractVectors(T.force, k, T.position); CAV.Vector3.normalise(T.force); CAV.Vector3.multiplyScalar(T.force, W); CAV.Vector3.set(T.acceleration); CAV.Vector3.add(T.acceleration, T.force); CAV.Vector3.add(T.velocity, T.acceleration); CAV.Vector3.multiplyScalar(T.velocity, G.dampening); CAV.Vector3.limit(T.velocity, G.minLimit, G.maxLimit); CAV.Vector3.add(T.position, T.velocity) } for(V = q.vertices.length - 1; V >= 0; V--) { U = q.vertices[V]; Q = Math.sin(U.time + U.step[0] * i * t.speed); P = Math.cos(U.time + U.step[1] * i * t.speed); O = Math.sin(U.time + U.step[2] * i * t.speed); CAV.Vector3.set(U.position, t.xRange * q.segmentWidth * Q, t.yRange * q.sliceHeight * P, t.zRange * S * O - S); CAV.Vector3.add(U.position, U.anchor) } q.dirty = true } function M() { D.render(I) } function J(O) { var Q, N, S = O; var P = function(T) { for(Q = 0, l = I.lights.length; Q < l; Q++) { N = I.lights[Q]; N.ambient.set(T); N.ambientHex = N.ambient.format() } }; var R = function(T) { for(Q = 0, l = I.lights.length; Q < l; Q++) { N = I.lights[Q]; N.diffuse.set(T); N.diffuseHex = N.diffuse.format() } }; return { set: function() { P(S[0]); R(S[1]) } } } function v() { window.addEventListener("resize", j) } function A(N) { CAV.Vector3.set(k, N.x, D.height - N.y); CAV.Vector3.subtract(k, L) } function j(N) { K(z.offsetWidth, z.offsetHeight); M() } C(); }) } else { alert('调用cav.js失败'); } });</script><div id="min_div" class="min_div" onclick="maxLogin()"> + 用户登录 </div>阅读全文
0 0
- qq主页面
- Android 仿QQ主页面
- Android 仿QQ主页面的实
- Android 仿QQ主页面的实
- SlidingPaneLayout实现最新版QQ主页面效果
- [Android实例] SlidingPaneLayout实现最新版QQ主页面效果
- 主页面
- 主页面
- 主页面
- 主页面
- 主页面
- 主页面
- Android 仿QQ主页
- 更新网站主页面
- 主页面弹出问题
- main主页面设置
- 操作主页面设置
- extjs 主页面
- 一次一密
- 焦点事件
- 计算1 / 1
- 前端知识整理之CSS命名（BEM）
- ubuntu解压rar文件
- qq主页面
- 顺序表应用6：有序顺序表查询
- 数据结构实验之栈与队列四：括号匹配
- 鼠标离开事件集
- Linux学习（二十一）：线程
- ORA-12519: TNS:no appropriate service handler found 解决
- aa
- Android Studio 插件开发详解二：工具类
- Javascript闭包（Closure）理解
