4

大きなロゴ（サイトのヘッダーにある）をロード時にヘッダー領域に配置しようとしています。そして、これは私が見つけることができる唯一のjquery関数であり、アイデアに合っているようです。

http://jsfiddle.net/apHLu/279/

var $dropDiv = $('#dropDiv');
   $('#holder a').on('click', function() {
    // get position of the element we clicked on
    var offset = $(this).offset();

    // get width/height of click element
    var h = $(this).outerHeight();
    var w = $(this).outerWidth();

    // get width/height of drop element
    var dh = $dropDiv.outerHeight();
    var dw = $dropDiv.outerWidth();

    // determine middle position
    var initLeft = offset.left + ((w/2) - (dw/2));

    // animate drop
    $dropDiv.css({
            left: initLeft,
            top: $(window).scrollTop() - dh,
            opacity: 0,
            display: 'block'
        }).animate({
            left: initLeft,
            top: offset.top - dh,
            opacity: 1
        }, 300, 'easeOutBounce');
});

基本的に知りたいのですが、クリックトリガーをオンロードコールに切り替えることはできますか？それが不可能な場合、私はそれを機能させるために混乱したくありません。

ありがとうございました。

4

1 に答える 1

2

これは更新された Fiddleです。 $(function() { ... });「Document is ready」の略です。また、関数を でラップしましたsetTimeout();。これは、完全な効果を確認するために少し速く起動したためです。の 2 番目のパラメーターを変更してsetTimeout、起動するまでの時間を調整します...

更新(@coby の提案による) :大量の画像がある場合は、に変更でき$(function() {ますwindow.onload(function() {。Ready は、すべての画像が完全に読み込まれるのを待ちません。

于 2012-11-07T14:47:40.767 に答える