Question

我使用highslide弹出。我希望有一个稳定的位置弹出窗口。

我试过了：

hs.marginTop="120";

当我有大量文本时它会起作用...当文本很短时，弹出窗口随机弹出。通常在右下角

我的代码：

                    hs.graphicsDir = "./includes/highslide/graphics/";
                    hs.outlineType = "rounded-white";
                    hs.wrapperClassName = "draggable-header";
                    hs.marginTop="120";

        $(function() {
                        var dialog=$(".siteText").html();
                        $("#highslide-html .highslide-body").html(dialog);

                        if(!$(".highslide-body").is(":empty"))
                        {   
                            hs.htmlExpand(this, { contentId: \'highslide-html\' } )
                        }

                    });

HTML：

        <div class="highslide-html-content" id="highslide-html" style="width:950px;color:black;">

                    <div class="highslide-header">
                            <ul>
                                    <li class="highslide-close">
                                            <a href="#" title="Close (esc)" onclick="return hs.close(this)"><span>Close</span></a>
                                    </li>
                            </ul>
                    </div>
                    <div class="highslide-body">
                    </div>
                <div class="highslide-footer">
                    <div>
                        <span class="highslide-resize" title="Resize">
                            <span></span>
                        </span>
                    </div>
                </div>
            </div>

编辑：它有效...但是效果非常难看......弹出跳跃。首先是在底部，然后跳到顶部。

if (!hs.ie || hs.uaVersion > 6) hs.extend ( hs.Expander.prototype, {
fix: function(on) {
    var sign = on ? -1 : 1,
        stl = this.wrapper.style;

    if (!on) hs.getPageSize(); // recalculate scroll positions


    hs.setStyles (this.wrapper, {
        position: "fixed",
        zoom: 1, // IE7 hasLayout bug,
        left: (parseInt(stl.left) + sign * hs.page.scrollLeft) +"px",
        top: "125px"
    });

    if (this.outline) {
        stl = this.outline.table.style;
        hs.setStyles (this.outline.table, {
            position: "fixed",
            zoom: 1, // IE7 hasLayout bug,
            left: (parseInt(stl.left) + sign * hs.page.scrollLeft) +"px",
            top: "120px"
        });

    }
    this.fixed = on; // flag for use on dragging
},
onAfterExpand: function() {
    this.fix(true); // fix the popup to viewport coordinates
},

onBeforeClose: function() {
    this.fix(false); // unfix to get the animation right
},

onDrop: function() {
    this.fix(true); // fix it again after dragging
},

onDrag: function(sender, args) {
    if (this.fixed) { // only unfix it on the first drag event
        this.fix(true);
    }
}});

THX：）

Answer 1

使用hs.marginTop不起作用。你所追求的是hs.targetX和hs.targetY。这些让你可以将弹出窗口定位在固定的位置，无论如何。请参阅API：http://highslide.com/ref/hs.targetX。注意对带有ID的目标“div”的要求 - 它可以只是一个空的占位符，但它必须存在。

Answer 2

添加

 .highslide-container
{
    position:fixed; top:200px; left:-380px
    }

你正在使用和删除的高级别CSS：

position: 'absolute', 
                left: 0, 
                top: 0,

仅来自您使用的高位滑动脚本

className: 'highslide-container'
            }, {
                position: 'absolute', 
                left: 0, 
                top: 0, 
                width: '100%', 
                zIndex: hs.zIndexCounter,
                direction: 'ltr'
            }, 
            document.body,

高位固定位置弹出窗口

2 个答案: