highslide - 使 Highslide 不可调整大小且可从所有 4 个侧面移动？

Question

（继续：http ://highslide.com/forum/viewtopic.php?t=24327 ）

我想让 Highslide 可以从所有边缘移动并且不可调整大小。

我已经能够使它不可调整大小，但我不能让它从所有边缘移动。它只从顶部移动。

我将如何做到这一点？我试过发布在（遗憾的是现在关闭）论坛上的代码，但没有。

谢谢

Answer 1

您可以创建自定义包装器并将.highslide-move类与.highslide-html-content类一起添加。使用contentId将自定义包装器绑定到您的弹出窗口。请参阅此演示： http: //jsfiddle.net/WbDMs/（请参阅下面的 jsFiddle 代码）
请注意，您不能从轮廓图形文件中移动弹出窗口（我在演示中使用黑色轮廓）。

如果您有实时页面，我可以查看它以了解您缺少什么。


来自 jsFiddle 的代码
在 head 部分：

<script type='text/javascript' src="highslide/highslide-with-html.js"></script>
<link rel="stylesheet" type="text/css" href="highslide/highslide.css"/>

<script type='text/javascript'>
//<![CDATA[ 
hs.graphicsDir = 'highslide/graphics/';
hs.outlineType = 'rounded-black';
hs.wrapperClassName = 'draggable-header';
hs.showCredits = false;
//]]>  
</script> 

<style type='text/css'>
 /* adjust the wrapper's padding */
.highslide-html-content {
  padding: 0 10px 10px 10px;
}

/* for demo purposes only */
.highslide-body {
  background: yellow
}
</style>

在正文部分
（将 href 中的 /roadrash/7AHX9/show/light/ 替换为您要在 iframe 弹出窗口中打开的页面）：

<div>
  <a href="/roadrash/7AHX9/show/light/" onclick="return hs.htmlExpand(this, { objectType: 'iframe', contentId: 'highslide-html' } )">
    Content in iframe
  </a>
</div>

<div class="highslide-html-content highslide-move" id="highslide-html">
  <div class="highslide-header">
    <ul>
      <li class="highslide-close">
        <a href="javascript:;" onclick="return hs.close(this)" style="cursor: pointer;"></a>
      </li>
    </ul>
  </div>
  <div class="highslide-body"></div>
</div>