Question

我有两个图标（Bootstraps Glyphicon），它们是

1：菜单屏幕左侧 2：屏幕右侧的礼物。

点击Menu时，Left to Right会显示切换。这很好用。但是，当点击Gift时，它会显示在某个奇怪的位置，如图像中显示的名称为Suraj Palwe ，这位于图像的左侧部分。我希望它从屏幕右侧出现，按照div的宽度向左移动。

这是图片的外观。 JSfiddle

这是我在代码中写的

style

.slide_birthday_click{
          margin-top: 2%;
          padding: 5px;

          background: grey;
          height: auto;
          display:none;
          position:absolute;
          z-index: 5;
          float: right;
        }

in html body

<div class="slide_birthday_click">
        <table class="table">
          <tr>
            <td>Suraj Palwe</td>
          </tr>
        </table>
    </div>
<span class="glyphicon glyphicon-gift" style="float:right;" id="today_birthdays"></span>

The Jquery Part

$("#today_birthdays").click(function(){
        $(".slide_birthday_click").toggle("slide",{direction:'right'},2000);
      });

我希望屏幕右侧包含单词Suraj Palwe的块，因为它从right to left切换。

This is the snap shot of js fiddle

我的代码中没有出错。提前谢谢！

Answer 1

尝试：

$("#today_birthdays").delay(200).show("slide", { direction: "right" }, 1500);

Answer 2

好的，这就是我解决问题的方法。其中有一件事遗失了！

刚刚将右：0; 添加到css文件

.slide_birthday_click{
      margin-top: 2%;
      padding: 5px;
      background: grey;
      height: auto;
      display:none;
      position:absolute;
      z-index: 5;
      float: right;
      right: 0;
    }

感谢所有人！

这是JS Fiddle Answer

的链接

无法从右向左切换Jquery

2 个答案: