は、私はあなたがボタン/ DIVを押したときに出てくるサイドバーからスライドしてきたが、私はボタン/ divのは、あまりにもここでそれを引き出したいjqueryの

-1

とDIV /ボタンを移動すると、私はは、私はあなたがボタン/ DIVを押したときに出てくるサイドバーからスライドしてきたが、私はボタン/ divのは、あまりにもここでそれを引き出したいjqueryの

<html> 
<meta name="viewport" content="width=device-width"/> 


<div id="header1"> 
<p>BillIsChill<p> 
<div id="menubutton"> 
<hr id="hr1"> 
<hr id="hr2"> 
<hr id="hr3"> 
</div> 



</div> 


<?php include('sidebar.html');?> 


<script src="/Scripts/script.js" type="text/javascript"></script> 
<script  src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js">  </script> 
<link type="text/css" rel="stylesheet" href="desktopstyle.css" /> 
<link type="text/css" rel="stylesheet" href="style_darkcyan.css" /> 
<link type="text/css" rel="stylesheet" href="sidebarBETA.css" />  <body> 


<script> 
$(document).on("click", "#menubutton", function(){ 
$('#sidebarright').toggle('slow'); 
}) 
</script>

を試してきたものです

とここで私は

#menubutton.open{ 
right: 205; 
} 
#menubutton{ 
display-inline; 
width:50px; 
height:50px; 
background:#006666; 
float:right; 
border-radius:10px; 
margin-top: 5px; 
margin-bottom: 5px; 
margin-right:5px; 
right: 5px; 

} 
#menubutton:hover{ 
background:cadetblue; 
} 
#sidebarright.open{ 
right: 1; 
}  
#sidebarright{ 
background: darkcyan; 
text-align: center; 
z-index: 2; 
position: fixed; 
height: 100%; 
width: 200px; 
float: right; 
top: 0; 
overflow-y: scroll; 
overflow-x: hidden; 
transition: right 0.5s; 
right:-200; 
}

を使用しています私の関連スタイルで誰かが私に

出典

2016-05-04 Nik Hendricks

HTMLを追加できますか？ – Gerard

2つのイベントハンドラを一緒に参加させることはできますが、表示したコードにすぐに間違ったものはありません。この問題は、CSSコードまたはJSコードのどこかに置く必要があります。残念ながら、そのコードを表示するために質問を編集しない限り、誰もあなたを助けることはできません。 –

メニューボタンのように見えるのはdivなので、ヘッダとリンクスタイルとphpのためのもの –

私はコードブロックが正しくフォーマットされていないと思います。しかし、CSSの下で問題を解決する必要があります。

#menubutton.open{ 
    right: 205; 
} 
#menubutton{ 
    display-inline; 
    width:50px; 
    height:50px; 
    background:#006666; 
    float:right; 
    border-radius:10px; 
    margin-top: 5px; 
    margin-bottom: 5px; 
    margin-right:5px; 
    right: 5px; 
} 
#menubutton:hover{ 
    background:cadetblue; 
} 
#sidebarright.open{ 
    right: 1; 
}  
#sidebarright{ 
    background: darkcyan; 
    text-align: center; 
    z-index: 2; 
    position: fixed; 
    height: 100%; 
    width: 200px; 
    float: right; 
    top: 60px; 
    overflow-y: scroll; 
    overflow-x: hidden; 
    transition: right 0.5s; 
    right:-200; 
    overflow: auto; 
} 
#header1 { 
    z-index: 3; 
}

出典

2016-05-06 03:47:26

を助けてくださいこれは

の作品

<body> 
<style> 
.open { display:none; } 
#buttonWrapper, #optionsWrapper { float:left; } 
ul { margin:0; } 
</style> 
<div id="menu"> 
    <div id="optionsWrapper"> 
    <div id="options" class="open"> 
     <ul> 
      <li>One</li> 
      <li>Two</li> 
      <li>Three</li> 
     </ul> 
    </div> 
    </div> 
    <div id="buttonWrapper"> 
    <button id="button">Click</button> 
    </div> 
</div> 

<script type="text/javascript"> 
$('#button').click(function(){ 
    $('#options').toggleClass('open'); 
}) 
</script> 
</body>

出典

2016-05-04 22:53:44 Gerard

上記のコードは私のために働いていません –

私はあなたのためにフィドルを作成しました：https://jsfiddle.net/beekvang/tvdhqhnz/3/ – Gerard

CSSで作業するためにスムーズに移行するように見えます –

は、私はあなたがボタン/ DIVを押したときに出てくるサイドバーからスライドしてきたが、私はボタン/ divのは、あまりにもここでそれを引き出したいjqueryの

答えて

関連する問題