このWeb サイトのページとしてスライド パネルを使用する予定です。私は JS 初心者ですが、ほぼ完璧なスクリプトができるまで、スクリプトを見つけて編集することができました。
問題は、外側をクリックするとスライド パネルが閉じてしまうことです。別のパネルが開いたときに閉じたいのですが、誰かがパネルの外側をクリックしたときは閉じません。
こちらもポートフォリオ以外は1ページのデザインになります。ポートフォリオ パネルを開いた状態で index.html へのリンクを作成します。それをしてもいいですか？私が意味することをよりよく理解するには、この画像を確認してください。
編集：わかりました、よりよく説明します。
ページにスライド パネルを使用するため、これは 1 ページのデザインになります。ただし、サイトを遅くしたくないので、各ギャラリー アイテムには独自の html ページがあります。
したがって、投稿した画像のように、ポートフォリオ パネルを開いた状態で、portfolioitem1.html を index.html にリンクする必要があります。
問題の最初の部分を解決する jsFiddle を次に示します。
http://jsfiddle.net/aUHwA/1/
パネルが崩れていたのは、document.click()あなたが使っていた機能です。すべてを$(document).ready()関数に移動し、スライダーとボタンの一般的なラッパーをいくつか追加し、3 つのボタンすべてで共有される一般的なクリック関数を使用しました。
クリック機能は、data-relクリックされたボタンのプロパティを使用して、どのパネルを切り替えるかを決定します。また、#contentdiv 内に既に表示されているパネルも非表示にします。
デフォルトでポートフォリオ パネルを開くには、これを on('click') 関数の直後に追加します。
$('#portfolio_button').click();
これにより、ポートフォリオ アニメーションがトリガーされます ( http://jsfiddle.net/aUHwA/3/を参照)。または:
$('#portfolio').slideToggle(0);
スライド アニメーションなしでポートフォリオ パネルを即座に開きます ( http://jsfiddle.net/aUHwA/2/を参照)。