0

我之前问了一个关于 HighSlide 中可拖动标题的相关问题，我从 RoadRash 那里得到了答案。（非常感谢！）

但是，该解决方案似乎不允许使用 contentId，我认为我需要多个扩展器。

下面的代码有两个链接。他们都“工作”。第一个大致是我原来问题的解决方案，但它提出了一个新问题。第二种更像我最初使用的方法，它们大致相似。

我需要的应该具有两种方法的优点。我需要一个可以拖动文本的标题，我不想要调整大小的拇指，并且我需要能够为同一页面上的不同 html 扩展器引用多个 div。我相信 contentId 是必要的，但我可能是错的。

（要明白我的意思，请将代码粘贴到任何实现 HighSlide 的页面中，然后单击每个 Click me。）

非常感谢任何帮助。当答案有效时，我总是检查绿色检查，并且我总是赞成知识渊博的帮助尝试。

<!-- THIS WORKS, BUT DOES NOT ALLOW ME TO SPECIFY CONTENT FOR EACH LINK.  -->

<a href="javascript:;" onclick="
    hs.headingText = 'First header - entire top is draggable!';
    return hs.htmlExpand(this, {wrapperClassName: 'draggable-header', width: 550})" 
        title="Popup Title" 
        class="highslide">
    Click Me First!
</a>
<div class="highslide-maincontent">
    <h3>First Example</h3>
    This one can be dragged by the entire header area. (Good for me.)<br>
    However, it supplies a resizing thumb in the lower-right corner. (Bad for me.)<br>
    It does NOT use contentId. (Which is necessary for me because I have
    many expanders on the page.)                
</div>

<br>
<br>

<!-- THIS WORKS ALSO, BUT ONLY THE TEXT IS DRAGGABLE.  -->

<a href="javascript:;" onclick="
    hs.headingText = 'Second header - only text is draggable!';
    return hs.htmlExpand(this, {wrapperClassName: 'draggable-header', contentId: 'myContent', width: 550})" 
        title="Popup Title" 
        class="highslide">
    Click Me Second!
</a>
<div class="highslide-html-content" id="myContent">
        <div class="highslide-header">
        <ul>
            <li class="highslide-close">
                <a href="#" onclick="return hs.close(this)"></a>
            </li>
        </ul>
    </div>
    <div class="highslide-body">
    <h3>Second Example</h3>
    This one can ONLY be dragged by the text in the header area. (Bad for me.)<br>
    It does not supply a resizing thumb in the lower-right corner. (Good for me.)<br>
    It DOES use contentId.  (Necessary for me because I have
    many expanders on the page.)            
    </div>
</div>
4

1 回答 1

1

您可以使用我在这里给您的解决方案（使用highslide-maincontentdiv）实现您想要的。

我们有一个预制的wrapperClassName用于删除带有调整大小图标的页脚，您可以将其添加到现有代码中，如下所示：wrapperClassName: 'draggable-header no-footer'

您可以在同一页面中使用任意数量的 highslide-maincontent 弹出窗口。只需确保将highslide-maincontentdiv 直接放置在结束锚标记之后</a>

现场演示：http: //jsfiddle.net/roadrash/mXmLN/1/

于 2013-03-22T22:38:13.403 回答