1

jquery masonry を使用して画像を表示しています。これらの画像には、タイトルのロールオーバーとフェードインを可能にするスクリプトがあります。ただし、ボックス内で完全に中央に配置したいと思います。Jquery masonry では、絶対的な高さの値はありません。とにかく、水平にできるように垂直に配置する方法はありますか (margin-right: auto; margin-left:auto; clear: both; と同様)

現在、配置は上から 50% に設定されていますが、小さな要素ではタイトルが中心からずれて表示されます。

ここに私の進捗状況へのリンクがあります: http://geoffjohnsondesign.com/inprogress

ご協力いただきありがとうございます。

ジェフ

4

2 に答える 2

0

かなり遅いですが、ここに行きます。

キャプションを50%に配置する必要がありますが、キャプションの半分のサイズだけ上に移動します。そのためにマージンを使用します。

したがって、jQueryコードのキャプションを非表示にしているコードを次のように置き換えます

$('.thumbnail .caption')
    .css({ marginTop: function(elem,val){ return $(this).outerHeight()/-2; } })
    .hide();
于 2011-11-12T01:35:08.667 に答える
0

これを試してみてください: 最初にやりたいことはdisplay: inline-blockposition: relative含まれている a:link 要素に対して設定することです (ページ上のすべての要素にこれを設定するのではなく、これらの要素に特定のクラスを割り当てる必要があります):

a:link {
    display: inline-block;
    position: relative;
    text-decoration: none;
}

それができたら、要素の垂直マージンを設定できます。

.thumbnail .caption {
    margin: 50% auto;
    position: absolute;
    text-decoration: none;
    top: 0;
    width: 100%;
}

それが機能するかどうかを確認してください。

于 2011-08-31T21:06:48.570 に答える