0

<li>わかりました-順序付けされていないリストに含まれているものを逆ループしようとしています。このループ中に、それぞれを削除して<li>から、親列の高さを隣接する列の高さと比較して、=<他の列になるようにします。これが真になったら、ループを解除して残りを表示します<li>。これが起こる前に、私はshuffle.jsを使用してリストをシャッフルしています。両方の列の高さをキャプチャできましたが、ループを開始するとコードが混乱しているようです。<li>

これがHTMLの短いバージョンです...

<body>  
  <div id="wrap">
        <div id="header"></div>
             <div id="main">This is the column that would set the height that determines the amount of [li] shown
            </div>
        <div id="sidebar">
            <ul id="shuffleunorderedlist">
                <li id="promo_1">
                    1
                </li>
                <li id="promo_2">
                    2
                </li>
                <li id="promo_3">
                    3
                </li>
                <li id="promo_4">
                    4
                </li>
                <li id="promo_5">
                    5
                </li>
                <li id="promo_6">
                    6
                </li>
                <li id="promo_7">
                    7
                </li>
                <li id="promo_8">
                    8
                </li>
                <li id="promo_9">
                    9
                </li>
                <li id="promo_10">
                    10
                </li>
                <li id="promo_11">
                    11
                </li>
                <li id="promo_12">
                    12
                </li>

            </ul>
        </div>
<div id="footer"></div>

これが私がこれまでに書いたjQueryとJavascriptです。

<script type="text/javascript">
jQuery(function($)
{
    window.onload = function()
    { 
        $('#shuffleunorderedlist').shuffle();   //********** Shuffle List 
    };
    var mainHeight = $('#main').height();   //********** Capture 'main' height 
    var sidebarHeight = $('#sidebar').height();     //********** Capture 'sidebar'     height 
        if (mainHeight > sidebarHeight)     //********** Compare 'sidebar' height 
            {
                var liCheck = $('div#sidebar.li').reverse().each(function ()    //********** reverse Loop through <li>'s  
                    {
                    while(liCheck())
                        {
                           $('li').hide(); //********** reverse Loop through <li>'s 
                             if (sidebarHeight =< mainHeight) 
                                    {
                                    break;  // breaks loop completely   //**********  Output <li>'s that are left 
                                    }
                        }  
                    }   
            }               
});
</script>

では、基本的にこれが機能しないのはなぜですか？どこで壊しているの？どうすればそれを機能させることができますか？

任意の提案、ヘルプと回答は大歓迎です。

4

1 に答える 1

0

あなたのコードは問題でいっぱいだったので、それらすべてを詳述する代わりに、あなたのコードをこれと比較してください：

var mainHeight = $('#main').height();
var sidebarHeight = $('#sidebar').height();
if (mainHeight < sidebarHeight) { // You are hiding things from the sidebar correct? Strictly speaking, this check isn't necessary, but it prevents us from looping when we don't need to. 
    $('div#sidebar li').each(function() {  // I removed reverse as it gave me a reference error. If it is defined for you, feel free to use it. 
        if (sidebarHeight > mainHeight) {  
            $(this).hide();  // hide only the current element
            sidebarHeight = $("#sidebar").height(); // update sidebarHeight 
        }
    });
}
于 2012-12-12T20:20:07.650 に答える