javascript - Toggling an off-canvas menu with addClass() -


I am currently building a Yii application where I want to create my own off canvas navigation.

It fades the fade, but I want to slide it from the left with the 0.5. How can I change it with jQuery? Do I need something like addClass () ?

Here's my HTML:

  & lt; Div id = "menu" & gt; & Lt; Button id = "toggle-menu" & gt; Toggle & lt; / Button & gt; & Lt; Ul class = "navigation" & gt; & Lt; Li class = "nav-item" & gt; & Lt ;? Php $ this- & gt; The widget ('zii.widgets.Cenu', array ('item' = & gt; array (array ('label' = & gt; 'array (' lunch / part '),' visible '=' home ' 'Url' = & gt; array ('lunch / house')), array ('label' = & gt; 'inscribe', 'url' = & gt; array ('/ site / login'), ' Visible 'and' username '-' = & gt; Yii :: app () -> user- & gt; isGuest), array ('label' = & gt; 'bih lunche' '' url '= & gt; ; Array ('/ lunch / admin'), 'visible' => Yii :: app () -> User-> name == "debas"), array ('label' = & gt; 'Beeharier Gebriker', 'url' = & gt; array (' / User / admin '),' visible '=> Yii :: app () -> User- & gt; name == "debas"), array (' label '=' gt; '.Yii :: app)) -> User- & gt; name'), 'url' = & gt; array ('/ site / logout'), 'visible' => Yii :: app () -> User-> IsGuest),)); ? & Gt; & Lt; / li & gt; & Lt; / Ul & gt; & Lt; / Div & gt;   

and my CSS:

  # menu {width: 250px; Status: Completed; Background: # 666; Height: 100%; Top: 0; Left: -300px; Infection: left S 0.5; List style: none; Z-index: 0; } # Toggle-menu {margin-top: 10px; Margin-left: 320px; }. Active {left: 0! Important; }   

and my javascript:

  $ (document) .ready (function () {$ ("# toggle-menu"). Function () {$ ('# menu'). Fade ('Slow')}}}    

You can use .animate ()

something like

  $ ('# menu') Chetan ({ Left: "- = 300",}, 500, function () {// animation complete.});    

Comments

Popular posts from this blog

php - PDO bindParam() fatal error -

logging - How can I log both the Request.InputStream and Response.OutputStream traffic in my ASP.NET MVC3 Application for specific Actions? -

java - Why my included JSP file won't get processed correctly? -