Javascript 当屏幕外菜单打开时，用其他类创建箭头键

因此，我尝试了各种javascript函数和切换选项，尝试使按钮从右箭头切换到左箭头

.arrow-right {
    display: block;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 20px solid white;
  margin-left:10px;

}

.arrow-left {
    display: block;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 30px solid white;
transform: 

我用来做这件事的javascript是

$('#showhide').click(function() {
    $(this).toggleClass('arrow-left');
});

您可以看到我在JSFIDLE中遇到的问题

---

任何帮助都是很棒的：）

你不需要两门课。您只需将

变换设置为
180deg
和
none
，具体取决于操作：

//Rotate by 180 degrees when "showhide" is clicked i.e. when opening.
$('#showhide').click(function() {
  $(this).css("transform", "rotate(180deg)");
});

//Remove the transform when the "exit-off-canvas is clicked i.e. when closing. 
$('.exit-off-canvas').click(function() {
  $('#showhide').css("transform", "none");
});

你不需要两门课。您只需将
变换设置为
180deg
和
none
，具体取决于操作：

//Rotate by 180 degrees when "showhide" is clicked i.e. when opening.
$('#showhide').click(function() {
  $(this).css("transform", "rotate(180deg)");
});

//Remove the transform when the "exit-off-canvas is clicked i.e. when closing. 
$('.exit-off-canvas').click(function() {
  $('#showhide').css("transform", "none");
});