Javascript 无法让jQuery滑到图像后面_Javascript_Jquery_Css_Jquery Ui_Slide

Javascript 无法让jQuery滑到图像后面

javascript jquery css jquery-ui

Javascript 无法让jQuery滑到图像后面,javascript,jquery,css,jquery-ui,slide,Javascript,Jquery,Css,Jquery Ui,Slide,所以我试图让你在点击一张图片时，共享栏中存储的另外两张图片会从左边滑出。当前的问题是，当图像滑出时，它们从按钮下方的左侧滑动，然后在动画完成后向上移动。我希望所有的一切都在同一个水平的整个时间，使图像似乎从后面滑出来有人能帮我吗？以下是我所拥有的： <script> $(function() { // run the currently selected effect function slideOut() {

所以我试图让你在点击一张图片时，共享栏中存储的另外两张图片会从左边滑出。当前的问题是，当图像滑出时，它们从按钮下方的左侧滑动，然后在动画完成后向上移动。我希望所有的一切都在同一个水平的整个时间，使图像似乎从后面滑出来

有人能帮我吗？以下是我所拥有的：

    <script>
    $(function() {
        // run the currently selected effect
        function slideOut() {

            var options = {};


        $("#sharebar").toggle("slide", options, 500,  callback() ); 

        };

        function callback() {

        };

        // set effect from select menu value
        $( "#download_link" ).click(function() {
            slideOut();
            return false;
        });

        $("#sharebar").hide();

    });
    </script>

</head>
<body>

<div style="margin:200px;min-height:10px;background:#e9e9e9;overflow:hidden;">

<img  id="download_link" src="Download.png" style="z-index:2;"/> 
<span id="sharebar" style="width:20px;z-index:1;">
<img id="exercise_link" src="exercises.png" /> 
<img id="subtitles_link" src="subtitles.png" />
</span>

提前谢谢！：

编辑：我认为这可能与z-index有关，但我不太确定

将顶部元素设置为具有style=position:修复了问题

编辑：哈哈，不知道为什么会有反对票，结果解决了问题P

我肯定地说，z指数将是一条出路。看起来您已经设置了一些z索引；只需修正z索引，使图像像您希望的那样层叠在一起

<img id="download_link" src="Download.png" style="z-index:2;"/> 
<span id="sharebar" style="width:20px;z-index:0;">
<img id="exercise_link" src="exercises.png" style="z-index:1" /> 
<img id="subtitles_link" src="subtitles.png" style="z-index:1" />

作为旁注：最好将这些样式属性粘贴到CSS文档中，而不是将它们放在HTML标记中

您能同时提供示例html吗？@Wex。哈哈哈Wex。。。史诗般的失败！这是作者的自我回答！我错了！哈哈。注意使用位置：虽然已固定。z索引可能是对多个项目进行分层的更安全的方法。