0

ページの読み込み時に display: none である div があります。divの表示を切り替えるボタンもあります(ブロックするものはありません)。ページロード後、初めてボタンをクリックして div を表示すると、角が丸くなっています (図 1 と 2)。次に、もう一度クリックして div を非表示にし、クリックして表示します。その後、丸みを帯びた角が台無しになり (写真 2 および 3)、div は (高さで) いくつかの追加ピクセルを拡張し、丸みを帯びた角はもう丸くされず、奇妙な「スキャンライン」のような線が含まれます。

コード：

<div id="filter-advanced">
<label for="filter-veld-value">
    <div class="filter-block and-block2">EN <span>
        <select name="filter-veld" id="filter-veld-name">
        <option value="">Kies een zoekveld...</option>
        <option value="domeinnaam_registrant">Domeinnaam registrant</option>
        <option value="domeinnaam_houder">Domeinnaam houder</option>
        <option value="provider_opmerkingen">Provider opmerkingen</option>
        <option value="ftp_opmerkingen">FTP opmerkingen</option>
        <option value="mysql_opmerkingen">MySQL opmerkingen</option>
        <option value="accc_cms_opmerkingen">CMS opmerkingen</option>
        <option value="stats_opmerkingen">Statistieken opmerkingen</option>
        <option value="opmerkingen">Overige opmerkingen</option>
    </select>                       
        bevat tekst</span>
    </div>
    <div class="filter-block">
        <input type="text" id="filter-veld-value" name="filter-veld-value" class="text" value="" />
    </div>
    <br class="clearboth" />
</label>
<label for="filter-regdatum-from-value">
    <div class="filter-block and-block3">EN <span>registratiedatum tussen</span></div>
    <div class="filter-block" id="regdatum">
        <input type="text" id="filter-regdatum-from-value" name="filter-regdatum-from-value" class="text-date" value="X1" />&nbsp;en&nbsp;&nbsp;<input type="text" id="filter-regdatum-to-value" name="filter-regdatum-to-value" class="text-date" value="X2" />
    </div>
    <br class="clearboth" />
</label>
<label for="filter-vvdatum-from-value">
    <div class="filter-block and-block3">EN <span>vervaldatum tussen</span></div>
    <div class="filter-block" id="vvdatum">
        <input type="text" id="filter-vvdatum-from-value" name="filter-vvdatum-from-value" class="text-date" value="X3" />&nbsp;en&nbsp;&nbsp;<input type="text" id="filter-vvdatum-to-value" name="filter-vvdatum-to-value" class="text-date" value="X4" />
    </div>
    <br class="clearboth" />
</label>

そして、jQuery

    $("p#advanced-tab A").click(function(){
    if ($(this).hasClass('inactive'))
    {
        $(this).removeClass("inactive");
        $(this).addClass("active");
        $(this).text("Minder opties [-]");
        $("#filter-advanced").css("display", "block");
        $(this).corner("10px tr tl");
    }
    else
    {
        $(this).removeClass("active");
        $(this).addClass("inactive");
        $(this).text("Meer opties [+]");            
        $("#filter-advanced").css("display", "none");
    }
});
$("#filter-advanced").corner("10px tr bl br");

代替テキスト http://www.admixconnect.nl/images/TMPcorners/beeld1.jpg

代替テキスト http://www.admixconnect.nl/images/TMPcorners/beeld2.jpg

代替テキスト http://www.admixconnect.nl/images/TMPcorners/beeld3.jpg

代替テキスト http://www.admixconnect.nl/images/TMPcorners/beeld4.jpg

4

1 に答える 1

1

角が丸いdivをスライドさせていますか？代わりに内側の div をスライドしてみてください。

于 2009-09-08T20:41:13.417 に答える