Foros del Web - Ver Mensaje Individual

abimaelrc · #4 (**permalink**) 29/05/2011, 21:09

Bueno algo así puedes hacer

index.php

Código PHP:

Ver original<?php
session_start();
if(!empty($_POST)){
    $zIndex = (int)$_POST['z_index'];
    $_SESSION[$_POST['id']] = $zIndex;
    echo $zIndex;
    exit;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link href="style.php" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function http(){
    if(typeof window.XMLHttpRequest!='undefined'){
        return new XMLHttpRequest();
    }else{
        try{
            return new ActiveXObject('Microsoft.XMLHTTP');
        }catch(e){
            alert('Su navegador no soporta AJAX');
            return false;
        }
    }
}
 
function request(url, params, id){
    var H=new http();
    if(!H)return;
    H.open('post',url+'?'+Math.random(),true);
    H.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    H.onreadystatechange=function(){
        if(H.readyState==4){
            document.getElementById(id).style.zIndex = H.responseText;
 
            H.onreadystatechange=function(){}
            H.abort();
            H=null;
        }
    }
    var p='';
    for(var i in params){
        p+='&'+i+'='+escape(params[i]);
    }
    H.send(p);
}
 
function addListener(element, type, expression, bubbling)
{
    bubbling = bubbling || false;
 
    if(window.addEventListener) { // Standard
        element.addEventListener(type, expression, bubbling);
        return true;
    } else if(window.attachEvent) { // IE
        element.attachEvent('on' + type, expression);
        return true;
    } else return false;
}
 
window.onload = function(){
    addListener(document.getElementById('div1'), 'click', function(){
        request('<?php echo $_SERVER['PHP_SELF']; ?>',
            {
                'id':'div1',
                'z_index':prompt('z-index',<?php echo array_key_exists('div1', $_SESSION) ? $_SESSION['div1'] : 1; ?>)
            },
            'div1'
        );
    });
    addListener(document.getElementById('div2'), 'click', function(){
        request('<?php echo $_SERVER['PHP_SELF']; ?>',
            {
                'id':'div2',
                'z_index':prompt('z-index',<?php echo array_key_exists('div2', $_SESSION) ? $_SESSION['div2'] : 2; ?>)
            },
            'div2'
        );
    });
    addListener(document.getElementById('div3'), 'click', function(){
        request('<?php echo $_SERVER['PHP_SELF']; ?>',
            {
                'id':'div3',
                'z_index':prompt('z-index',<?php echo array_key_exists('div3', $_SESSION) ? $_SESSION['div3'] : 3; ?>)
            },
            'div3'
        );
    });
}
</script>
</head>
<body>
<div id="wrap">
    <div id="div1"></div>
    <div id="div2"></div>
    <div id="div3"></div>
</div>
</body>
</html>

style.php

Código PHP:

Ver original<?php
    session_start();
    header('Content-Type: text/css;');
?>
*{ margin: 0; padding: 0; }
html, body{ width: 100%; height: 100%; }
#wrap{
    position: relative;
    width: 200px;
    margin: 0 auto;
}
#div1{
    width: 100px;
    height: 100px;
    background-color: #000;
    position: absolute;
    top: 1px;
    left: 1px;
    z-index: <?php echo array_key_exists('div1', $_SESSION) ? $_SESSION['div1'] : 1; ?>;
}
#div2{
    width: 100px;
    height: 100px;
    background-color: #f00;
    position: absolute;
    top: 40px;
    left: 30px;
    z-index: <?php echo array_key_exists('div2', $_SESSION) ? $_SESSION['div2'] : 2; ?>;
}
#div3{
    width: 100px;
    height: 100px;
    background-color: #00f;
    position: absolute;
    top: 20px;
    left: 50px;
    z-index: <?php echo array_key_exists('div3', $_SESSION) ? $_SESSION['div3'] : 3; ?>;
}