将Animated Jquery Side Nav转换为Vanilla JS

Question

我需要帮助将Jquery侧导航菜单转换为Vanilla JS。我是JS的初学者，不知道如何实现这一目标。还有任何关于动画汉堡图标的建议，当点击时转换为X？谢谢。任何帮助表示赞赏

...
let(:params) {{
  :stringParam => 'Here is my string',
  :intParam    => 238,
  :fileParam   => *??????,*
}}

/**********************
  ****NAVIGATION****
**********************/
#sidebar{
	background: #151718;
	width: 12.500em;
	height: 100%;
	display: block;
	position: absolute;
	left: -12.500em;
	top: 0px;
	transition: left 0.3s linear;
}

#sidebar.visible{
	left: 0.000em;
}

nav{
	text-align: center;
}

ul{
	margin: 0.000em;
	padding: 0.000em;
}

ul li{
	list-style: none;
}

ul li a{
	background: #1c1e1f;
	color: #ccc;
	border-bottom: 1px solid #111;
	display: block;
	width: 11.250em;
	padding: 0.625em;
	text-decoration: none;
	text-transform: uppercase
}
 

ul li a:hover{
	color: #4876FF; 
}

#sidebar-btn{
	display: inline-block;
	vertical-align: middle;
	width: 1.563em;
	height: 1.250em;
	cursor: pointer;
	margin: 1.250em; 
	position: absolute;
	top: 0.000em;
	right: -3.750em;
}

#sidebar-btn span{
	height: 0.063em;
	background: #282828;
	margin-bottom: 0.313em;
	display: block;
}

Answer 1

将... @Override public void onFocusChange(View v, boolean hasFocus) { switch (v.getId()) { case id.CEditText: Toast.makeText(this,"C",Toast.LENGTH_LONG).show(); // Handle onFocusChange for editText1 break; case id.DEditText: Toast.makeText(this,"D",Toast.LENGTH_LONG).show(); // Handle onFocusChange for editText2 break; case id.EEditText: Toast.makeText(this,"E",Toast.LENGTH_LONG).show(); // Handle onFocusChange for editText3 break; case id.FEditText: Toast.makeText(this,"F",Toast.LENGTH_LONG).show(); // Handle onFocusChange for editText4 break; case id.GEditText: Toast.makeText(this,"G",Toast.LENGTH_LONG).show(); // Handle default scenario. break; } } 替换为window.onload = function(){}; $(document).ready()的{​​{1}}; .addEventListener("click", function() {})的{​​{1}}; .click(function() {})

的document.getElementById()

＆＃13;

＆＃13;

jQuery()

＆＃13;

Element.classList.toggle()

＆＃13;

＆＃13;

＆＃13;