2011-01-06 5 views
0

나는 CSS로 스타일링 된 네 개의 상자가 있고 오른쪽에 마가 니가 나란히 서있다. 마지막 상자에서 오른쪽 여백을 제거하는 클래스를 추가하여 모두 같은 줄에 앉아 있습니다. 여기 jquery last addclass

여기 <head>

<script type="text/javascript"> 

    $(document).ready(function(){   
     $('div.home-features:last').addClass('last'); 
    }); 
</script> 

에있는 JQuery와 인 코드가

를 생성
<div class="content-box2-top"><!-- no content--></div> 
<div class="content-box2-center">  

     <div class="home-features"> 
      <h2>Services</h2> 
      <span class="content"> 
       One point of contact for your international operations eliminating the need for multiple relationships.<br /> 

      </span> 
      <a class="read" href="/getdoc/762a1cb8-2492-4844-8401-5037e7c30afc/Services">Read More</a> 
     </div> 

     <div class="home-features"> 
      <h2>Process</h2> 
      <span class="content"> 
       Global access to your accounts, 24 hours a day through our secure online accounting portal. 
      </span> 

      <a class="read" href="/getdoc/6c7b45da-4e86-44fa-9a15-6d1298576b8a/Process">Read More</a> 
     </div> 

     <div class="home-features"> 
      <h2>Benefits</h2> 
      <span class="content"> 
       Alleviating the burden of recruiting and managing in-house accounting teams. 
      </span> 
      <a class="read" href="/getdoc/592b78e1-f17f-498e-b3bb-f159e4c2d348/Benefits">Read More</a> 

     </div> 

     <div class="home-features"> 
      <h2>Reach</h2> 
      <span class="content"> 
       Drawing on the local knowledge and expertise of our partner firms around the world. 
      </span> 
      <a class="read" href="/getdoc/9e82f2b8-7aaa-417d-9c23-a235c4ff26fd/Reach">Read More</a> 
     </div> 


</div> 
<div class="content-box2-bottom"><!-- no conetnt --></div> 

문제는 그 "마지막"을 추가 지연은 페이지가로드가있을 때 클래스에서 마지막 요소로. 그래서 그것은 다른 세 밑에 나타나고, 그 다음 장소에 핑 소리가 난다!

어떻게하면 막을 수 있으며 인라인으로 표시됩니까?

답변

0

페이지가 여전히로드되어 있기 때문일 수 있습니다. $(document).ready(function(){은 페이지가로드 될 때만 발생합니다.

확실하지 않지만 $('div.home-features:last').addClass('last');을 "content-box2-bottom"이후로 이동 한 경우 나머지 페이지로드가 없어도 발생한다고 생각합니다.

+0

JavaScript 코드를 이동해도 큰 차이는 없습니다. 그것이 문서의 전체 요점입니다 .ready –

+1

content-box2-bottom 다음에 엄청난 양의 코드가있을 것입니다. OP가 (마지막으로 바람직한 방법 인) ASP를 사용하여'last' 클래스를 추가 할 수 없다면 시도해 볼 가치가 있습니다. –

0

페이지를 조작 할 준비가되면 document.ready 코드가 실행됩니다. 이것은 아마도 지연의 원인이 될 것입니다.

당신은 단지 divlast 클래스를 지정할 수 없습니다 :

<div class="home-features last"> 

이 그것을 적용하기 전에로드를 전까지 기다릴 필요없이 장소에이 클래스가있는 페이지에 도착 의미합니다.

+0

div가 asp.net repeater에서 생성되지 않습니다. – user1417094

+0

그리고 데이터 소스 란 무엇입니까? 행이 마지막 행일 때 stipluate하는 일부 메타 데이터를 생성 할 수 있다면 class 속성 내의 일부 '<% %>'에이를 포함시킬 수 있습니다. –

1

내 자신의 취향이 아니라 jQuery를보다 직접 CSS를 사용하는 것입니다 :

content-box2-center > div:last, 
content-box2-center > div:last-child { 
    /* CSS here */ 
} 

당신은 물론, 다른 접근 사용할 수 있습니다 JQuery와 {와

content-box2-center { 
    visibility: hidden; 
    /* or display: none; */ 
} 

$(document).ready(
    function(){ 
     $('div.home-features:last').addClass('last'); 
     $('content-box-center').show(); 
    });