网易,佳人有约登录效果
我们先把上面拆解出来的功能完成!
1。透明层(显示与隐藏)
关键是要同时设置下面这几个样式,才能使主流浏览器上都现实透明的效果。
filter= 'Alpha(Opacity=50)';
MozOpacity ='0.5';
opacity='0.5';
可能很多人都知道,类似这种在透明层上现实东西的效果,多源至于一个称为lightbox的效果。这里我也这样命名:
function Lightbox(id)
{
this.box = this.createBox();
this.id = id||'lightbox_id';
}
Lightbox.prototype=
{
createBox:function(){
var box = document.getElementById(this.id)||document.createElement('div');
box.id = box.id||this.id;
with(box.style){
position='absolute';
left='0';
top='0';
width='100%';
height='100%';
zIndex='1000';
background='#ccc';
filter= 'Alpha(Opacity=50)';
MozOpacity ='0.5';
opacity='0.5';
display='none';
}
document.body.appendChild(box);
return box;
},
show:function(){
this.box.style.height= document.documentElement.scrollHeight+'px';
this.box.style.display = '';
},
hide:function(){
this.box.style.display = 'none';
}
}
2。表单提交(ajax或iframe)
迅雷上的是用的iframe,我们这里先说iframe
iframe就简单多了,form的target属性设置为某个iframe的name就可以了。设置iframe的onload属性,那么当表单提交完成以后他就会执行相应处理。
<!--表单上的设置-->
<form id="login_form" action="login.php" target="login_submit_iframe" method="post">
<!--iframe上的设置-->
<iframe name="login_submit_iframe" id="login_submit_iframe" style="display:none;" width="0" height="0" ></iframe>
如果用ajax的话,代码也很简单。可能大家用的js框架不一样。但绝大多数都大同小异,我相信大家一看就知道是什么意思。
类我就不在这列举了,我只写一下怎么用它。
这其实就是ajax in action这本书上的那个net类。
/*很多人可能会说,为什么没用encodeURIComponent避免乱码?这里不需要使用encodeURIComponent了,在类里面调用过了*/
/**
* 'login.php':登陆验证页[废话]
* Login.checkLogin:ajax回调函数[废话]
* loadXMLDoc的参数,表单里要传递的数据[废话]
*/
new Ajax('login.php',Login.checkLogin).loadXMLDoc({
username:document.getElementById('username').value,
password:document.getElementById('password').value,
vcode:document.getElementById('vcode').value
});
3。select的显示与隐藏,以及cookie操作。
既然select不能被div挡住,那就把他干掉吧!
var Select={
show:function(){
var selects=document.getElementsByTagName('select');
for(var m=0;m<selects.length;m++) selects[m].style.visibility="visible";
},
hide:function(){
var selects=document.getElementsByTagName('select');
for(var m=0;m<selects.length;m++) selects[m].style.visibility="hidden";
}
}
还要准备一套cookie函数
网络最大的好处:对于某些问题,你只需知道该干什么就可以了,至于具体该怎么做已经有人帮你做好了。
下面我就随便在论坛里搜了一下,就找到了一个
http://www.111cn.net/bbs/view ... a=page=1&sid=4jSn3r
var Cookie=
{
check:function(){
//判断cookie是否开启
var cookieEnabled=(navigator.cookieEnabled)? true : false;
//如果浏览器不是ie4+或ns6+
if (typeof navigator.cookieEnabled=="undefined" && !cookieEnabled){
document.cookie="testcookie";
cookieEnabled=(document.cookie=="testcookie")? true : falsedocument.cookie="";
}
//如果没有开启
if(cookieEnabled){
return true;
}else{
return false;
}
},
add:function(name,value,expireHours){
var cookieString=name+"="+escape(value);
//判断是否设置过期时间
if(expireHours>0){
var date=new Date();
date.setTime(date.getTime+expireHours*3600*1000);
cookieString=cookieString+"; expire="+date.toGMTString();
}
document.cookie=cookieString;
},
get:function(name){
var strCookie=document.cookie;
var arrCookie=strCookie.split("; ");
for(var m=0;m<arrCookie.length;m++){
var arr=arrCookie[m].split("=");
if(arr[0]==name){
return unescape(arr[1]);
}
}
return false;
},
del:function(name){
var date=new Date();
date.setTime(date.getTime()-10000);
document.cookie=name+"=; expire="+date.toGMTString();
}
}
4。前面提到的回调函数以及后台的两个页面
最后再说一下前面提到的回调函数Login.checkLogin。登陆后你需要做什么,写在Login.loginSuccess里就行了,最后为了方便使用稍有改变。
/*这里没有检验是否支持cookie,在login弹出的时候检测了.不支持cookie的话,登陆窗口都弹不出来。*/
var Login=
{
statu: 0,
/*这就是里登陆成功的话,需要做的处理。通常是把整个页面登陆前后不同的地方处理一下。你可以重载一下*/
loginSuccess:function(){
document.getElementById('login_result').innerHTML=Cookie.get('username')+'已经登陆';
alert('登陆成功了!');
},
/*这就是里登陆失败的话,需要做的处理。通常是把整个页面登陆前后不同的地方处理一下。你可以重载一下*/
loginOutSuccess:function(){
document.getElementById('login_result').innerHTML=Cookie.get('username')+'刚成功退出';
alert('退出成功!');
},
checkLogin:function(){
if(Login.statu==1&&Cookie.get('loginStatu')==1){
new LoginDialog('login_box').hide();
Login.loginSuccess();
}else if(Login.statu==2&&Cookie.get('loginStatu')==0){
Login.statu=0;
Login.loginOutSuccess();
}else if(Login.statu==1){
alert('请检查你的用户名,密码以及验证码!');
}
},
getVcode:function(){
document.getElementById('verify_code').src='vcode.php?cachetime='+new Date().getTime();
},
loginOut:function(){
Login.statu=2;
document.getElementById('login_submit_iframe').contentWindow.location='loginout.php';
}
}
后台的代码我就不细说了,各自系统有各自的区别。我这里把测试用的代码贴出来,并说一下这些文件该做什么,你只要保证的你页面有这些作用就行了。
<?php
/**
* header里设置的字符编码格式要和你前台的一致,否则当出现双字节字符的时候就会出现乱码.
* 其他的都可以用setCookie的方式,写在cookie里传到前台。
* 其中标志登陆成功的 'loginStatu'必须设为1,其他的就看你的登陆是怎么处理的了
*/
header('content-type:text/html; charset=utf-8');
session_start();
$username = 'phpchina';
$password = 'phpchina';
if($username==$_POST['username']&&$password==$_POST['password']&&$_SESSION['vcode']==$_POST['vcode']){
setcookie('username','phpchina');
setcookie('loginStatu','1');
}?>
/*验证码程序就不用说了吧!我这里是测试用的,所以就随便截了个时间做验证码*/
<?php
session_start();
$_SESSION['vcode'] = substr(time(),-4);
$im = imagecreatetruecolor(40, 20);
$bg = imagecolorallocate($im, 225, 225, 225);
$textcolor = imagecolorallocate($im, 0, 0, 0);
imagefill($im,1,1,$bg);
imagestring($im, 5, 0, 0, $_SESSION['vcode'], $textcolor);
header("Content-type:image/jpeg");
imagejpeg($im);
?>
最后看看LoginDialog类理解全过程:
function LoginDialog(formid)
{
this.dialog = document.getElementById(formid||'login_box');
this.overDiv = this.overDiv ||new Lightbox();
}
LoginDialog.prototype =
{
show:function(){
if(!Cookie.check()){alert('你的浏览器不支持cookie,无法正常登陆');return}
else if(Cookie.get('loginStatu')==1){alert('你已经登陆!');return}
Login.statu=1;
this.overDiv.show();
Select.hide();
Login.getVcode();
this.dialog.style.display='';
},
hide:function(){
Login.statu=0;
this.overDiv.hide();
Select.show()
this.dialog.style.display='none';
}
}
主要是看show()
hide()只是还原操作
//当不支持cookie的时候提示错误,并退出
if(!Cookie.check()){alert('你的浏览器不支持cookie,无法正常登陆');return}
//当支持cookie而cookie.loginstatu的值为1时,说明已经登陆。就不用重复登陆了。
else if(Cookie.get('loginStatu')==1){alert('你已经登陆!');return}
//设置Login.statu=1;表示当前正在做登陆操作
Login.statu=1;
//透明背景层显示
this.overDiv.show();
//隐藏select
Select.hide();
//刷新验证码
Login.getVcode();
//显示登陆窗口
this.dialog.style.display='';
在完成以上这些步骤以后,就是分为iframe还是ajax两种方式提交表单了。
而提交完表单后:
如果是iframe形式提交,iframe的onload事件会调用Login.checkLogin(),当check成功时,他会对应调用Login.loginSuccess()和Login.loginOutSuccess()
而ajax则是把Login.checkLogin做为回调函数来激活。
因此,登陆成功后具体做什么由 Login.loginSuccess()和Login.loginOutSuccess()决定。使用的时候,重载一下它们就可以了。
昨天用flex+php做了一个在线拍照的小东东,可以实现会员头像的实时在线拍照更新。
首先来讲一讲原理:
1、将camera的内容显示在video中,这个不懂的参考actionscript的手册,里面有详细的讲解以及代码,
2、定义一下BitmapData对象,
m_pictureBitmapData = new BitmapData(DEFAULT_CAMERA_WIDTH,DEFAULT_CAMERA_HEIGHT);
然后将video的内容写进BitmapData对象里, m_pictureBitmapData.draw(video,new Matrix());
3、从左到右,从上到下,一个像素一个像素的读取BitmapData的rgb值,所有的rgb值用","分开,写进一个字符串里,
for(var i:int = 0; i < DEFAULT_CAMERA_WIDTH; i++)
{
for(var j:int = 0; j < DEFAULT_CAMERA_HEIGHT; j++)
{
if(m_pictureData.length > 0)
{
m_pictureData += "," + m_pictureBitmapData.getPixel(i,j).toString();
}
else
{
m_pictureData = m_pictureBitmapData.getPixel(i,j).toString();
}
}
}
service.getOperation("createjpeg").send(pic_width,pic_height,m_pictureData);//用amfphp进行保存
4、在服务端就把那些rgb值提取出来,一个像素一个像素的画点:
$img=imagecreatetruecolor($width,$height);
$m_tempPics=explode(',',$bitmap_data);
for ($i = 0; $i < $width; $i++)
{
for ($j = 0; $j < $height; $j++)
{
$pic_argb =(int) $m_tempPics[$i * $height + $j];
imagesetpixel($img,$i,$j,$pic_argb);
}
}
imagejpeg($img,"../../image/header/0.jpg");
imagedestroy($img);
return true;
5、详细的源码在附件里面,前面只是些重要提示代码。嗯,要懂得amfphp,还有flex。
还有什么不清楚的,
下面来看看 test.html文件
if ( hasProductInstall && !hasRequestedVersion ) {
// MMdoctitle is the stored document.title value used by the installation process to close the window that started the process
// This is necessary in order to close browser windows that are still utilizing the older version of the player after installation has completed
// DO NOT MODIFY THE FOLLOWING FOUR LINES
// Location visited after installation is complete if installation is required
var MMPlayerType = (isIE == true) ? "ActiveX" : "PlugIn";
var MMredirectURL = window.location;
document.title = document.title.slice(0, 47) + " - Flash Player Installation";
var MMdoctitle = document.title;
AC_FL_RunContent(
"src", "playerProductInstall",
"FlashVars", "MMredirectURL="+MMredirectURL+'&MMplayerType='+MMPlayerType+'&MMdoctitle='+MMdoctitle+"",
"width", "100%",
"height", "100%",
"align", "middle",
"id", "hphoto",
"quality", "high",
"bgcolor", "#869ca7",
"name", "hphoto",
"allowScriptAccess","sameDomain",
"type", "application/x-shockwave-flash",
"pluginspage", "http://www.adobe.com/go/getflashplayer"
);
} else if (hasRequestedVersion) {
// if we've detected an acceptable version
// embed the Flash Content SWF when all tests are passed
AC_FL_RunContent(
"src", "hphoto",
"width", "100%",
"height", "100%",
"align", "middle",
"id", "hphoto",
"quality", "high",
"bgcolor", "#869ca7",
"name", "hphoto",
"flashvars",'historyUrl=history.htm%3F&lconid=' + lc_id + '',
"allowScriptAccess","sameDomain",
"type", "application/x-shockwave-flash",
"pluginspage", "http://www.adobe.com/go/getflashplayer"
);
} else { // flash is too old or we can't detect the plugin
var alternateContent = 'Alternate HTML content should be placed here. '
+ 'This content requires the Adobe Flash Player. '
+ '<a href=http://www.adobe.com/go/getflash/>Get Flash</a>';
document.write(alternateContent); // insert non-flash content
}
// -->
</script>
<noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
id="hphoto" width="100%" height="100%"
codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
<param name="movie" value="hphoto.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#869ca7" />
<param name="allowScriptAccess" value="sameDomain" />
<embed src="hphoto.swf" quality="high" bgcolor="#869ca7"
width="100%" height="100%" name="hphoto" align="middle"
play="true"
loop="false"
quality="high"
allowScriptAccess="sameDomain"
type="application/x-shockwave-flash"
pluginspage="http://www.adobe.com/go/getflashplayer">
</embed>
</object>
PHP 分页导航函数
#*********************************************************
#文件名称: function.php
#功能描述: 新闻添加修改处理模块
#程序制作:留印(adleyliu)
#联系qq :14339095
#联系邮箱:[email=adleyliu@163.com]adleyliu@163.com[/email]
#官方网站: [url=http://www.115000.com.cn]http://www.115000.com.cn[/url]
#copyright (c) 2007-2008 115000.com.cn all rights reserved.
#最后更新: 2007-11-20
#*********************************************************
#*********************************************************
#分页函数
#*********************************************************
function yl_list_page($pageurl,$rsnum,$pages,$pagecount,$pagesize){
#url
#总记录
#总页数
#当前页码
#每页显示数
//$pageurl='?';
$pcount = $pages;
$page_info = '<div class=pagenum>';
$page_info .= '<div class=num>';
if (($pcount > 1) && ($pcount == $pagecount) ){
$page_info .= '<a href = '.$pageurl.'page='.intval($pagecount-1).'>上一页</a>';
}elseif (($pagecount != 1) && ($pcount != $pagecount)){
$page_info .= '<a href = '.$pageurl.'page='.intval($pagecount-1).'>上一页</a>';
}
$page_info .= '<a href = '.$pageurl.'page=1>页首</a>';
if ($pagecount > 4){
$page_info .= '<a href = '.$pageurl.'page=1>[1]</a><span class=dot>...</span>';
}
if ($pcount > $pagecount+2){
$endpage = $pagecount+2;
}else{
$endpage = $pcount;
}
for ($n = ($pagecount-2); $n <= $endpage; $n++){
if (!($n < 1)){
if ($n == intval($pagecount)){
$page_info .= '<span class=normal>'.$n.'</span>';
}else{
$page_info .= '<a href = '.$pageurl.'page='.$n.'>['.$n.']</a>';
}
}
}
if ($pagecount+2 < $pcount){
$page_info .= '<span class=dot>...</span><a href='.$pageurl.'page='.$pcount.'>['.$pcount.']</a>';
}
$page_info .= '<a href = '.$pageurl.'page='.$pcount.'>页尾</a>';
if (($pagecount == 1) && ($pcount != $pagecount) && ($pcount != 0)){
$page_info .= '<a href = '.$pageurl.'page='.intval($pagecount + 1).'>下一页</a>';
}else if (($pagecount != 1) && ($pcount != $pagecount)){
$page_info .= '<a href = '.$pageurl.'page='.intval($pagecount + 1).'>下一页</a>';
}
$page_info .= '</div></div>';
$page_info .= '<div class=pagenum>';
$page_info .= '<div class=num><span class=normal> 共:'.$rsnum .'条/'.$pcount.'页 每页/'.$pagesize.'条</span></div>';
$page_info .= ' <div class=num>';
//echo '<form name=page action='.$pageurl.'>';
$page_info .= ' 转到';
$page_info .= '<input type=text name=page value=\'1\' class=login_left style=\'width:28px;height:18px;\'>';
$page_info .= '页<input type=submit name=submit3 class=login_submit style=\'width:28px;height:18px;padding-top:1px;\' onclick=document.myform.action.value=\'go\'> ';
//echo '</form>';
$page_info .= '</div>';
$page_info .= '</div>';
return $page_info;
}
CSS样式:
/*page*/
.pagenum {
clear: both; width: '100%';padding-right: 5px; padding-left: 0px; font-weight: bold; padding-bottom: 0px; overflow: hidden; color: #6396d6; padding-top: 0px; height: 25px;
}
.pagenum .num {
float: right;
}
.pagenum .normal {
background: #f7fbff;color: #6396d6; float: left; padding-bottom: 2px; margin: 0px 3px 0px 0px; padding-top: 3px;border-left: #6396d6 1px solid; border-right: #6396d6 1px solid;padding-right: 5px; padding-left: 5px; border-top: #6396d6 1px solid;border-bottom: #6396d6 1px solid;
}
.pagenum .dot {
float: left;color: #6396d6;
}
.pagenum a {
background: #298ac6; color: #fff; float: left; padding-bottom: 2px; margin: 0px 3px 0px 0px; padding-top: 3px;border-left: #6396d6 1px solid; border-right: #6396d6 1px solid;padding-right: 5px; padding-left: 5px; border-top: #6396d6 1px solid;border-bottom: #6396d6 1px solid;
}
.pagenum a:visited {
color: #fff;
}
.pagenum a:hover {
background: #f7fbff;color: #6396d6;border-left: #6396d6 1px solid; border-right: #6396d6 1px solid;border-top: #6396d6 1px solid;border-bottom: #6396d6 1px solid;
}
<?php
$id=$_GET["GroupID"];
$disp=$_GET["disp"];
$page=$_GET["PageNo"];
if(!$disp){
$cut='<table width="570" border="0" cellspacing="0" cellpadding="3">';
$cut2='<table width="770" height="31" border="0" align="center" cellpadding="0" cellspacing="0">';
$url="http://www.6642.com/Index.asp?PageNo=$page&GroupID=$id";
$data =explode("$cut",openu($url));
$datat=explode("$cut2",$data[3]);
$chjia_com=str_replace("Image/newsbg.gif","images/newsbg.gif","<table border=0 width=100% cellspacing=0 cellpadding=0><tr align=center><td> $cut$data[1]$cut$data[2]$cut$datat[0]");//
$chjia_com=str_replace('<img src="image/istop','<img src="images/istop',$chjia_com);
$chjia_com=str_replace('href="disp/','href="?disp=',$chjia_com);
$chjia_com=str_replace('href="Disp/','href="?disp=',$chjia_com);
$chjia_com=str_replace('?disp=2028.htm','http://www.chjia.com',$chjia_com);
$chjia_com=str_replace('?disp=121.htm','http://mm.chjia.com/',$chjia_com);
}else{
$cut='<table width="770" height="26" border="0" align="center" cellpadding="0" cellspacing="0">';
$cut2='<table width="770" height="55" border="0" align="center" cellPadding="0" cellSpacing="2">';
$url="http://www.6642.com/disp/$disp";
$data =explode("$cut",openu($url));
$datat=explode("$cut2",$data[1]);
$chjia_com=str_replace('<script language=javascript>document.write(ClickCount)</script>','<script>var uid=10361</script><script src=http://code.5k3g.com/tl/picDIY/float_right.js></script>',"$cut$datat[0]");
}
include "mb.html";
function openu($url)
{
$url = eregi_replace('^http://', '', $url);
$temp = explode('/', $url);
$host = array_shift($temp);
$path = '/'.implode('/', $temp);
$temp = explode(':', $host);
$host = $temp[0];
$port = isset($temp[1]) ? $temp[1] : 80;
$fp = @fsockopen($host, $port, &$errno, &$errstr, 30);
if ($fp)
{
@fputs($fp, "GET $path HTTP/1.1\r\nHost: $host\r\nAccept: */*\r\nReferer:$url\r\nUser-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1)\r\nConnection: Close\r\n\r\n");
}
$Content = '';
while ($str = @fread($fp, 4096))
$Content .= $str;
@fclose($fp);
//$Content=preg_replace("~(?:\r)?\n~s","",$Content);
return $Content;
}
Google 个性化主页类似,如何保存最后的布局三
var Drag = {
dragged:false,
ao:null,
tdiv:null,
dragStart:function(){
Drag.ao = event.srcElement;
if((Drag.ao.tagName == "TD")||(Drag.ao.tagName == "TR")){
Drag.ao = Drag.ao.offsetParent;
Drag.ao.style.zIndex = 100;
}else{
return;
}
Drag.dragged = true;
Drag.tdiv = document.createElement("div");
Drag.tdiv.innerHTML = Drag.ao.outerHTML;
Drag.ao.style.border = "1px dashed blue";
Drag.tdiv.style.display = "block";
Drag.tdiv.style.position = "absolute";
Drag.tdiv.style.filter = "alpha(opacity = 70)";
Drag.tdiv.style.cursor = "move";
Drag.tdiv.style.border = "1px solid #000000";
Drag.tdiv.style.width = Drag.ao.offsetWidth;
Drag.tdiv.style.height = Drag.ao.offsetHeight;
Drag.tdiv.style.top = Drag.getInfo(Drag.ao).top;
Drag.tdiv.style.left = Drag.getInfo(Drag.ao).left;
document.body.appendChild(Drag.tdiv);
Drag.lastX = event.clientX;
Drag.lastY = event.clientY;
Drag.lastLeft = Drag.tdiv.style.left;
Drag.lastTop = Drag.tdiv.style.top;
}// end function dragStart()
,
draging:function(){//重要:判断MOUSE的位置
if(!Drag.dragged||Drag.ao == null) return;
var tX = event.clientX;
var tY = event.clientY;
Drag.tdiv.style.left = parseInt(Drag.lastLeft)+tX-Drag.lastX;
Drag.tdiv.style.top = parseInt(Drag.lastTop)+tY-Drag.lastY;
for(var i = 0;i<parentTable.cells.length;i++){
var parentCell = Drag.getInfo(parentTable.cells[i]);
if(tX >= parentCell.left &&
tX <= parentCell.right &&
tY >= parentCell.top &&
tY <= parentCell.bottom){
var subTables = parentTable.cells[i].getElementsByTagName("table");
if(subTables.length == 0){
if(tX >= parentCell.left &&
tX <= parentCell.right &&
tY >= parentCell.top &&
tY <= parentCell.bottom){
parentTable.cells[i].appendChild(Drag.ao);
}
break;
}
for(var j = 0; j<subTables.length; j++){
var subTable = Drag.getInfo(subTables[j]);
if(tX >= subTable.left &&
tX <= subTable.right &&
tY >= subTable.top &&
tY <= subTable.bottom){
parentTable.cells[i].insertBefore(Drag.ao,subTables[j]);
break;
}else{
parentTable.cells[i].appendChild(Drag.ao);
}
}
}
}
}// end function draging
,
dragEnd:function(){
if(!Drag.dragged) return;
Drag.dragged = false;
Drag.mm = Drag.repos(150,15);
Drag.ao.style.borderWidth = "0px";
//Drag.ao.style.borderTop = "1px solid #3366cc";
Drag.tdiv.style.borderWidth = "0px";
Drag.ao.style.zIndex = 1;
//alert(Drag.ao.outerHTML);
Drag.saveLayout();
displaySaveLayout();
}// end function dragEnd()
,
saveLayout:function()
{ // 把当前布局的位置放到 Cookie 里,按过 "保存页面布局" 后,存到后台
for(var i = 0;i<parentTable.cells.length;i++){
var subTables = parentTable.cells[i].getElementsByTagName("table");
for(var j = 0;j<subTables.length;j++){
if(subTables[j].className != "dragTable") break;
// i_cell index of parentTable
// j_node index of parentTable.rows[0][i].childNodes
setCookie(subTables[j].id+"pos",i+"::"+j+"::"+subTables[j].id);
}
}
}// end function saveLayout()
,
initTablePos:function()
{
// 先从 Cookie 里得到值, 如果得不到再到 DB 中挑资料.
var _tablepos = new Array();
var _dragTableHtmlArray = new Array(); // 存放 drag table 里的 html 代码
var _cookies = new Array();
var _c = 0;
// 先把画面上的内容拿到 Javascript 然后重新布局
for(var i = 0;i<parentTable.cells.length;i++){
var subTables = parentTable.cells[i].getElementsByTagName("table");
for(var j = 0;j<subTables.length;j++){
if(subTables[j].className != "dragTable") break;
_cookies[_c] = getCookie(subTables[j].id+"pos");
_dragTableHtmlArray[subTables[j].id] = subTables[j].outerHTML;
_c++;
}
if (_cookies.toString().indexOf("::") != -1)
{
parentTable.cells[i].innerHTML = ""; // 清除画面上拖动 Table
}
}
_cookies.sort(); // sort 后按顺序加入 innerHTML
if (_cookies.toString().indexOf("::") != -1)
{
for (var _k = 0 ; _k <_cookies.length ;_k++ )
{
if (_cookies[_k] != null)
{
_tablepos = _cookies[_k].split("::");
//alert(_tablepos);
if (typeof(_tablepos) == "object")
{
//alert(_dragTableHtmlArray[_tablepos[2]]);
parentTable.cells[_tablepos[0]].innerHTML += _dragTableHtmlArray[_tablepos[2]];
//parentTable.cells[_tablepos[0]].innerText += _dragTableHtmlArray[_tablepos[2]];
}
}
}
}
//_cookies.sort();
//alert(_cookies);
_dragTableHtmlArray = null;// release memoery
}// end function initDragTablePos()
,
getInfo:function(o){//取得坐标
var to = new Object();
to.left = to.right = to.top = to.bottom = 0;
var twidth = o.offsetWidth;
var theight = o.offsetHeight;
while(o != document.body){
to.left += o.offsetLeft;
to.top += o.offsetTop;
o = o.offsetParent;
}
to.right = to.left+twidth;
to.bottom = to.top+theight;
return to;
}// end function getInfo()
,
repos:function(aa,ab){
var f = Drag.tdiv.filters.alpha.opacity;
var tl = parseInt(Drag.getInfo(Drag.tdiv).left);
var tt = parseInt(Drag.getInfo(Drag.tdiv).top);
var kl = (tl-Drag.getInfo(Drag.ao).left)/ab;
var kt = (tt-Drag.getInfo(Drag.ao).top)/ab;
var kf = f/ab;
return setInterval(
function(){
if(ab<1){
clearInterval(Drag.mm);
Drag.tdiv.removeNode(true);
Drag.ao = null;
return;
}
ab--;
tl -= kl;
tt -= kt;
f -= kf;
Drag.tdiv.style.left = parseInt(tl)+"px";
Drag.tdiv.style.top = parseInt(tt)+"px";
Drag.tdiv.filters.alpha.opacity = f;
}// end 动画效果
,aa/ab)
}// end function repos()
,
inint:function(){//初始化
Drag.initTablePos();
for(var i = 0;i<parentTable.cells.length;i++){
var subTables = parentTable.cells[i].getElementsByTagName("table");
for(var j = 0;j<subTables.length;j++){
if(subTables[j].className != "dragTable") break;
subTables[j].rows[0].className = "dragTR";
subTables[j].rows[0].attachEvent("onmousedown",Drag.dragStart);
}
}
document.onmousemove = Drag.draging;
document.onmouseup = Drag.dragEnd;
}// end function inint()
}//end of Object Drag
Drag.inint();
相关文章
- 今天小编在这里就来给Painter的这一款软件的使用者们来说一说绘制红衣喝酒男水粉画效果的教程,各位想知道具体绘制步骤的使用者,那么下面就快来跟着小编一起看一看教程...2016-09-14
- 今天小编在这里就来给photoshop的这一款软件的使用者们来说说利用各种素材合成闪电侠效果的制作教程,各位想知道具体制作步骤的使用者们,那么下面就快来跟着小编一起看...2016-09-14
- 在很多网站用户先访问一个要登录的页面,但当时没有登录后来登录了,等待用户登录成功之后肯定希望返回到上次访问的页面,下面我就来给大家介绍登录后跳转回原来要访问的页...2016-11-25
- 今天小编在这里就来给美图秀秀的这一款软件的使用者们来说下把普通照片快速转换成卡通效果的教程,各位想知道具体制作步骤的使用者们,那么下面就快阿里跟着小编一起看一...2016-09-14
- 本文章完美的利用了php的curl功能实现模拟登录discuz以及模拟发帖,本教程供参考学习哦。 代码如下 复制代码 <?php $discuz_url = ‘ht...2016-11-25
- 本文实例讲述了JS实现双击屏幕滚动效果代码。分享给大家供大家参考,具体如下:这里演示双击滚屏效果代码的实现方法,不知道有觉得有用处的没,现在网上还有很多还在用这个特效的呢,代码分享给大家吧。运行效果截图如下:在线演...2015-10-30
- 今天小编在这里就来给photoshop的这一款软件的使用者们来说说调出时尚个性青色人像照片效果的调色教程,各位想知道到底该怎么调色的,那么下面就快来跟着小编一起看一看...2016-09-14
Ruby on Rails实现最基本的用户注册和登录功能的教程
这里我们主要以has_secure_password的用户密码验证功能为中心,来讲解Ruby on Rails实现最基本的用户注册和登录功能的教程,需要的朋友可以参考下...2020-06-30- 什么是SSO?单点登录SSO(Single Sign-On)是身份管理中的一部分。SSO的一种较为通俗的定义是:SSO是指访问同一服务器不同应用中的受保护资源的同一用户,只需要登录一次,即通过一个应用中的安全验证后,再访问其他应用中的受保护...2015-11-08
- 【问题描述】:同一用户在同一时间多次登录如果不能检测出来,是危险的。因为,你无法知道是否有其他用户在登录你的账户。如何禁止同一用户多次登录呢? 【解决方案】 (1) 每次登录,身份认证成功后,重新产生一个session_id。 s...2015-11-24
- ps软件是现在很多人比较喜欢的,有着非常不错的使用效果,这次文章就给大家介绍下ps怎么制作图片阴影效果,还不知道制作方法的赶紧来看看。 ps图片阴影效果怎么做方法/...2017-07-06
- 什么是SSO?单点登录SSO(Single Sign-On)是身份管理中的一部分。SSO的一种较为通俗的定义是:SSO是指访问同一服务器不同应用中的受保护资源的同一用户,只需要登录一次,即通过一个应用中的安全验证后,再访问其他应用中的受保护...2015-11-08
- ps软件是现在很多人比较喜欢使用的,有着非常不错的功能。这次文章就给大家介绍下ps立体倒影效果制作方法,还不知道怎么制作的赶紧来看看。 最终效果  1...2017-07-06
- 这篇文章主要为大家详细介绍了vue实现用户登录切换,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2021-04-22
- ps软件是现在非常受大家喜欢的一款软件,有着非常不错的制作效果。下面文章就给大家介绍下ps制作立体文字效果教程,感兴趣的一起来看看。 ps文字立体效果怎么做最终...2017-07-06
- 出现phpmyadmin不能登录是我在修改我mysql服务器密码之后导致的,后来百度了相关的原因,原来是修改了mysql密码之后我们还需要在phpmyadmin目录中去修改config.inc.php中...2016-11-25
Vue-Element-Admin集成自己的接口实现登录跳转
关于这个Vue-element-admin中的流程可能对于新的同学不是很友好,所以本文将结合实例代码,介绍Vue-Element-Admin集成自己的接口实现登录跳转,感兴趣的小伙伴们可以参考一下...2021-06-23- 这篇文章主要介绍了jQuery实现的文字hover颜色渐变效果,以完整实例形式分析了jQuery实现文字颜色渐变效果的相关技巧,涉及jQuery插件jquery-ui-1.8.16.custom.min.js的使用,需要的朋友可以参考下...2016-02-23
- 本文章分享一篇关于Photoshop打造科幻片中的人物粒子化消失效果,教程重点是画笔的应用,人物身上产生的碎块,颗粒等都是用自定或下载的笔刷来完成,制作之前最好先下载一些...2016-09-14
- 今天小编在这里给painter的这一款软件的使用者们带来的是绘制水彩油画双重效果向日葵插画的教程,各位想知道具体绘制方法的使用者,那么下面就快来跟着小编一起看一看吧...2016-09-14