0

見出しと段落の高さの値を取得したい。サイズを変更するときに、オフセットを設定して互いの下に収まるようにすることができます。これは、それらが絶対に設定されているためです。

通常は別の方法で行いますが、絶対位置で行う必要があります。これは、このレスポンシブ スライダーが機能する方法だからです。

ただし、 each() を使用すると、最初のスライド (現在のスライド) でのみ正しく機能し、他のすべてのスライドでは正しく機能しません。スライドのサイズは変更されませんが、スライドを横に移動すると。

<div class="slide-content">
    <h2><span class="slide-title"><?php the_title() ?></span></h2>
    <p class="slide-text"><?php echo $text; ?></p>

    <a href="<?php echo get_permalink( $meta["page"] ) ?>" class="da-link">> Jetzt Informieren</a>
</div>

function test() {
    $(".slide-content").each(function() {
        var content = $(this);

        var title = content.find(".slide-title");
        var text = content.find(".slide-text");
        var link = content.find(".da-link");

        var titleheight = title.height();
        var textheight = text.height();

        text.css("top",titleheight+"px");
        link.css("top",titleheight+textheight+"px");

    });
}

これが私の機能です。

私が得る値は次のとおりです。

title: 122 text: 54 
title: 164 text: 144 
title: 164 text: 126

最初のペアは正しいです。他は間違っています。したがって、現在のスライドでのみ機能します。これは、現在表示されているスライドによって異なります。スライドは display:none に設定されていません。移動すると、変更されるのは左オフセットだけです。

関数は次のように呼び出されます。

$(window).resize(function () {
        test();
    });

Google Chrome で確認すると、ステージのスライドが移動しても要素のサイズは同じままです。

each() でかなり苦労しました。それで、これは何でしょうか？

4

1 に答える 1

0

最初に CSS リセットを適用したことを確認してください。

次に、CSS で、見出しと段落に「em」で行の高さを指定してみてください。

于 2013-03-04T12:08:36.303 に答える