jQuery CSS를 적재하기 위해 적용합니다

Question

나는 CSS가로드 된 div에 동적으로 적용하는 데 load() 기능. 로드중인 HTML이 발견되고 삽입되어 Close 명령을 사용할 수 있습니다. 그러나 신청하려는 CSS는 등록되지 않았습니다. 모든 것이 잘 작동하는 것 같습니다. 동적 CSS를 뺀 것 같습니다. 여기에 뭔가 잘못되었거나 잘못된 기능이있을 수 있다고 생각합니다.

jQuery :

$(document).ready(function() {
    //Find & Open
    $(".projectThumb").click(function(){
        htmlName = $(this).find("img").attr("name");
        $("#popupContainer").load(htmlName + ".html");
        });

    //Apply CSS
    $(".projectPopup").css({"position": "absolute", "background": "#000", "top": "10%", "left": "10px"});

    //Close property
    $("a.close").live("click", function(){
        $("#popupContainer").empty();
        });
});

test.php :

<div id="content">
    <div class="projectThumb">
      <img src="/img/aeffect_button_static.gif" name="aeffect" />
      <p class="title">title</p>
    </div>
</div>
<div id="popupContainer"></div>

aeffect.html :

<div class="projectPopup" id="aeffect">
  <a class="close">Close &times;</a>
  <p class="description">Description</p>
</div>

Answer 1

당신은 잘못된 시간에 CSS 속성을 설정하고 있습니다. 로드 () 메소드의 콜백 함수를 사용하여로드가 완료된 후 CSS 속성을 적용하는 것입니다.

 $("#popupContainer").load(htmlName + ".html", {}, function(){
     $(".projectPopup").css({"position": "absolute", "background": "#000", "top": "10%", "left": "10px"});
 });

Answer 2

.load ()의 콜백에 적용 CSS를 넣으십시오.

$(document).ready(function() {
    //Find & Open
    $(".projectThumb").click(function(){
        htmlName = $(this).find("img").attr("name");   
        $("#popupContainer").load(htmlName + ".html", null, function(){
            //Apply CSS
            $("projectPopup").css({"position": "absolute", "background": "#000", "top": "10%", "left": "10px"});

        });




    //Close property
    $("a.close").live("click", function(){
        $("#popupContainer").empty();
        });
});