JQuery ikinci satırda kaydırmadan önce bir satırdaki son elemanı algılayabilir mi?

Question

<style> 
    .ms_menu ul{list-style:none;} 
    .ms_menu ul li{float:left; padding:5px; border-right:1px solid #000000;} 
    .ms_menu ul li:last-of-type{border-right:none;} 
    </style> 

örnek html:

<div class="ms_menu"> 
    <ul> 
     <li>menu1</li> 
     <li>menu2</li> 
     <li>menu3</li> 
     <li>menu4</li> 
     <li>menu5</li> 
     </ul> 
    </div> 

Ben LI sol yüzdürülür ile UL içeren bir üst nav menü var. Her bir LI, her menü seçeneği arasında bir ayırıcı olarak işlev gören bir CSS stili {border-right 1px solid} içerir ve son LI'daki border-right öğesini kaldırmak için CSS seçiciyi son kullanmıştım.

Bu, tarayıcı penceresi yeniden boyutlandırılana ve LI'ların bir kısmı ikinci satıra kadar açılana kadar harika görünür. Son çocuk şekillendirme kuralı hala gerektiği şekilde uygulanır, ancak bu noktada, ikinci satırın üzerine kaydırılmadan önce son sağdaki kenarlık sınırını kaldırmak istiyorum.

Sözcük kaydırma/satır sonu oluşmadan önce satırdaki son öğeyi algılamak için jQuery veya genel Javascript yolu var mı?

Answer 1

ölçebilir onların offset:

$(window).resize(function() { 

    var offsets = [], 
     $listItems = $('.ms_menu li'); 

    $listItems.each(function() { 
     offsets.push($(this).offset().top); 
    }); 

    $.each(offsets, function(i, v) { 
     $listItems.eq(i).css('border-right-width', v > offsets[index + 1] ? 0 : 1); 
    }); 

}).resize();