0

私は本当に解決できない問題を抱えています.css / jsで比較的新しいので、皆さんが私を助けてくれることを願っています. ファンシーボックスギャラリーと一緒にきちんとしたCSS3ページトランジションテンプレートを使用しようとしています.

すべてjquery.fancybox.js問題ありませんが、テンプレート メニュー リンクを使用すると機能しなくなり、それらをクリックしても何も起こらず、トランジションが発生しなくなります。sを使用する両方に関係があるのではないかと思いますhref(テンプレートはhrefs を使用する 1 ページのサイトであり.js、写真を呼び出すのも同じですか?)

私の悪い英語と成熟した質問の欠如で申し訳ありません。誰かが私が話していることを知っていて、私を助けてくれることを願っています. 乾杯!

編集:

助けてくれてありがとう、ここに2つのリンクがあります。ページ上のすべてはネットからコピーされたコードであり、テスト目的のためだけに私のものではないことに注意してください。

jquery fancybox で動作しない

これは、jquery がその魔法を行っているのを見ることができます。[ポートフォリオで表示] をクリックすると、画像は適切に表示されますが、メニューが機能しなくなり、ナビゲートできなくなります。

jquery fancybox なしで作業する

これは jsquery なしで、ナビゲーションが適切に機能し、ページ遷移が発生することを確認できますが、ポートフォリオのビューのサムネイルをクリックすると、もちろん .jpeg が表示され、写真をナビゲートできません。

助けてくれてありがとう、これが修正可能であることを願っているので、ページ遷移が機能するjquery fancybox画像ビューを機能させることができます!

4

1 に答える 1

0

CSS3トランジションを強制終了するのはfancyboxではありません。この問題は、script.jsファイルの次の行によって作成されます。

$('a').bind('click', function (event) {
  var $anchor = $(this);
  $('html, body').stop().animate({
    scrollTop: $($anchor.attr("href")).offset().top
  }, 1000, "easeOutExpo");
  event.preventDefault();
});

...ここで、fancyboxがバインドされているアンカー()を含む、Webページのすべてevent.preventDefault()のアンカーを設定します。<a class="fancybox" ...>

たとえば、コメントアウトするevent.preventDefault()と、fancyboxとCSS3の両方のトランジションがシームレスに機能します。

JSFIDDLEを参照してください

一般的に言って、イベントをバインドしたり、cssルールを一般的な要素やタグに適用したりするのは良い考えではありませんが、代わりに特定性を使用します。ほとんどの場合、他のイベントをそれらの要素にバインドするプラグインがいくつかある場合は、そうする代わりに

$('a')

行う

$('a.selector')
于 2013-01-13T21:49:31.327 に答える