Click here to Skip to main content
15,891,136 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
CSS
#slider{
    width:500px;
    top:150px;

     z-index:999999999;
    position:fixed;
    background:white;
}

#header{
    width:270px;
    height:1190px;
    position:absolute;
    right:0px;
    border:1px solid #d8d8d8;

    padding:5px 35px;
    border-radius:3px;
    box-shadow: 0 0 8px gray;
    background:white;
}


#sidebar{
    position:absolute;
    top:180px;

    left:113px;
    box-shadow: 0 0 8px gray;
}

#sidebar1{
    position:absolute;
    top:180px;
   
    z-index:999999999;
    left:113px;
    box-shadow: 0 0 8px gray;
}
Posted
Comments
Monika Rangta 18-Sep-14 3:48am    
function open_panel()
{
slideIt();
// $('#slider').css({
// position: 'absolute',
//
// });
var a=document.getElementById("sidebar");
a.setAttribute("id","sidebar1");
a.setAttribute("onclick","close_panel()");
}

function slideIt()
{
var slidingDiv = document.getElementById("slider");
var stopPosition = 0;

if (parseInt(slidingDiv.style.right) < stopPosition )
{
slidingDiv.style.right = parseInt(slidingDiv.style.right) + 2 + "px";
setTimeout(slideIt, 1);
}
}

function close_panel(){
slideIn();
a=document.getElementById("sidebar1");
a.setAttribute("id","sidebar");
a.setAttribute("onclick","open_panel()");
}

function slideIn()
{
var slidingDiv = document.getElementById("slider");
var stopPosition = -342;

if (parseInt(slidingDiv.style.right) > stopPosition )
{
slidingDiv.style.right = parseInt(slidingDiv.style.right) - 2 + "px";
setTimeout(slideIn, 1);
}
}
Monika Rangta 18-Sep-14 3:49am    
<div id="slider" style="right:-342px;">
<div id="sidebar" önclick="open_panel()">
<img src="images/usecoupon.bmp" />
</div>
<div id="header">
<img src="images/coupon.bmp" style="max-width:140%; margin-left:-30px; " />

</div>
</div>

1 solution

I did it myself. :)
Thanks to me.

just by adding css in javascript.

C#
function open_panel()
{
    slideIt();
    $('#slider').css({
        position: 'absolute',

    });
var a=document.getElementById("sidebar");
a.setAttribute("id","sidebar1");
a.setAttribute("onclick","close_panel()");
}





C#
function close_panel(){
slideIn();
$('#slider').css({
        position: 'fixed',

    });
a=document.getElementById("sidebar1");
a.setAttribute("id","sidebar");
a.setAttribute("onclick","open_panel()");
}
 
Share this answer
 
Comments
Monika Rangta 22-Sep-14 3:42am    
Still there is problem as the slider come out...i wanna fix window position at the sliding out div??

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900