0

在这个小提琴中:http: //jsfiddle.net/ak4Ed/139/

当我单击一个节点(加载 iframe)时,树结构与 iframe 的底部对齐。如何对齐树以保持在相应 iframe 的顶部?

我尝试添加margin:0px;到包含树的 div 中,但它不起作用。

这是小提琴代码:

<div id="demo1" style="height:100px;display:inline-block;margin:0px;">
     <ul>
         <li id="node_1_id">
             <a>Root node 1</a>
             <ul>
                 <li id="child_node_1_id">
                     <a>Child node 1</a>
                 </li>
                 <li id="child_node_2_id">
                     <a>Child node 2</a>
                 </li>
             </ul>
         </li>

     </ul>
     <ul>
                    <li><a>Team A's Projects</a>
                        <ul>
                        <li><a>Iteration 1</a>
                            <ul>
                                <li><a>Story A</a></li>
                                <li><a>Story B</a></li>
                                <li><a>Story C</a></li>
                            </ul>
                            </li>
                        <li><a>Iteration 2</a>
                        <ul>
                            <li><a>Story D</a></li>
                              </ul>
                            </li>
                        </ul>
                    </li>
                </ul>
 </div>
 <div style="display: inline-block;">
    <iframe id="preview" src=""></iframe>
</div>

$(function() {

    $('#preview').toggle();
    $("#demo1").jstree({
        "plugins": ["ui", "html_data", "themes", "hotkeys"]
    });

    $("#demo1").on("select_node.jstree", function() {
        var node = $(this).find("a.jstree-clicked").parent("li");

        $('#preview').show();
            $('#preview').attr('src', 'http://www.google.com')

        alert("selected node: "+node.attr("id"));
    });
});
4

3 回答 3

1

只需将“vertical-align:top”添加到 div 样式

<div id="demo1" style="height:100px;display:inline-block;margin:0px;vertical-align:top">

jsfiddle

于 2013-08-25T12:04:10.067 回答
0

如果您希望树保持在 iFrame 的顶部:

<div id="demo1" style="height:100px;display:inline-block;margin:0px;margin-right:100%">

jsFiddle

于 2013-08-25T12:10:16.870 回答
0

演示

只需将其添加到 CSS

 #demo1
{  position:fixed;

    }


在 div 中 附加 position:fixed;id demo1

<div id="demo1" style="position:fixed;height:100px;display:inline-block;margin:0px;vertical-align:top">

希望这有帮助,谢谢

于 2013-08-25T12:21:16.173 回答