0

[編集：答えは得られましたが、同じページに複数のhtmlエクスパンダーがある場合は機能しません。私の新しい質問を見てください。]

これはとても簡単なはずです！htmlExpandを使用しています。

Highslideに必要なのは、ここに示すように、右にXが付いたドラッグ可能なヘッダーだけです。これが組み込みでハイスライドにすぐに使用できるわけではないことに驚いていますが、残念ながら、これは「ほぼ」機能しているように見えます。

グラフィックでは、見出しテキストの灰色/青色の背景がドラッグ可能な領域を表しています。（.highslide-headingの背景として半透明の.pngを使用しています。Xグラフィックは実際にはその背後にあります。）

ドラッグ可能な領域をほぼ右端まで拡張し、Xの数ピクセル手前で停止して、ヘッダーのほぼ全体をウィンドウのようにドラッグできるようにします。

示されているように、私は100％のハイスライド見出しの幅を持っており、Xはドラッグ可能なスペースの「後ろ」にあるため、クリックできません。.highslide-headingの幅を90％に変更すると機能しますが、灰色の領域が短くなり、奇妙に見えます。

もちろん、パーセンテージを試すこともできますが、同じページにいくつかのポップアップアイテムがあり、サイズが異なるため、特定のパーセンテージがすべてに適しているわけではありません。（PSの結果はとにかくブラウザによって異なります。）

ポップアップするコンテンツに柔軟に対応できるように、他のアプローチではなくhtmlExpandを引き続き使用したいことを覚えておいてください。（ここに示す例は、写真とキャプションだけなので、他のアプローチを使用してHighslideで簡単に拡張できることを知っています。）

私が求めている解決策：どういうわけか、ドラッグ可能なスペースの「上」に閉じるボタンが必要だと思います。必要なCSSプロパティはz-indexだと思いますが、どこにどのように挿入するのかわかりません。どこに置いても.CSSファイルには効果がないようです。

助けていただければ幸いです。私は正しい答えをチェックし、人々を賛成します。

ここに画像の説明を入力してください

4

2 に答える 2

1

これにより、正しい方向を示すことができます。このデモページでRoadRashのコーディングを見てください。

http://www.roadrash.no/hs-support/iframe-closebutton-redirect.html

ただし、リダイレクトではなくXで通常の「閉じる」必要があるため、オーバーレイの「html」属性を標準に変更します。

html: '<div class="closebutton" onclick="return hs.close(this)" title="Close"></div>',
于 2013-03-21T21:57:52.493 に答える
1

hs.registerOverlayEarlyOutによって提案されたものを使用するか、CSSを少し変更するだけで、必要なすべてを実行できる既成のものを使用できますwrapperClassName: 'draggable-header'（またはグローバル設定として使用する場合）。hs.wrapperClassName = 'draggable-header';

すでにを使用していると思いますがwrapperClassName: 'draggable-header'、目的を達成するには、ヘッダーの背景色を正しいCSSセレクターに追加する必要があります。また、透明なX（閉じる）グラフィックファイルと数行の追加のCSSを使用する必要があります。 。
このjsFiddleを参照してください：http：//jsfiddle.net/roadrash/mXmLN/

于 2013-03-22T08:37:34.490 に答える