2012-09-18 13 views
0

나는 wordpress 내의 멋진 CodaSlider를 사용하여 내 페이지에 탭 기능을 추가했지만 벽에 조금 닿았습니다.새로 고침 div onClick

CodaSlider는 현재 내용을보고 자동으로 높이를 정의하는 스크립트를 사용합니다. 그러나 슬라이더가 이미 정의 되었기 때문에 더 많은 내용을 표시하려면 슬라이더 내부에서 div를 열고 닫을 수있는 옵션이 있습니다. 높이를 입력하면 자동으로 업데이트되지 않습니다.

내 생각은 슬라이더의 div를 새로 고치는 JQuery 조각을 추가하여 항상 전체 페이지를 다시로드하지 않고도 새로운 내용을 표시하는 것이 었습니다.

는 지금까지 내가 무엇을 가지고 :

<div class="video-centre"> 
    <div class="video-title"> <img src="<?php echo get_bloginfo('template_url') ?>/images/video-propertiesforsale.jpg" alt="properties for sale" /> </div> 
    <div class="video-point"> <img src="<?php echo get_bloginfo('template_url') ?>/images/video-point.jpg" alt="video pointer" /> </div> 
    <div class="video-thumb"> 
     <div class="coda-slider" id="slider-id"> 
     <div> 
      <h2 class="title"><span>Crouch End</span></h2> 
      <?php the_field('crouch_end'); ?> 
      <p class="video-more2"><a href="javascript:animatedcollapse.show(['expandable-2'])" id="refresh">View More</a></p> 
      <div id="expandable-2"> 
      <?php the_field('properties_for_sale_hidden'); ?> 
      <p class="video-close2"><a href="javascript:animatedcollapse.hide(['expandable-2'])" id="refresh">Close</a></p> 
     </div> 
     </div> 





<script> 
var $r = jQuery.noConflict(); 
    $r(function() { 
     $r("#refresh").click(function(evt) { 
     $r(".panel").load("index.php") 
     evt.preventDefault(); 
     }) 
    }) 
</script> 

내가 공격 한 벽은 스크립트가 돼있 실제 내용보다는 전체 페이지를로드하고 내가 그것을 얻이 수없는 것이다 내가 원하는 것을하기. 나는 위의 희망

은 내 머리 속에 확실히 소리, 이해할 수있다 : S

답변

0

그래, .load는 페이지의 전체 내용을로드하기위한 것입니다. 당신은 당신이 원하는 것을 얻을 수있는 어린이를 통과, .load 실행할 수 있습니다

var div = $('<div/>').load('index.php'); 
$('.panel').replaceWith(div.find('.panel')); 
+0

감사를 나에게 다시 얻기를 위해, 나는 라인을 교체한다 (". 패널") $ r에 부하를 ("인덱스입니다.. php ") 귀하의 제안과 함께? –

+0

예,하지만 $ –

+0

대신 noConflict 변수를 사용하십시오. 흠 ... 좋은 테스트를 받았지만 지금은 컨텐츠를로드하지 않고 다른 상위 div를 축소합니다. 나는 그것을 새로 고치기 위해 잘못된 div를보고 있을지도 모른다고 생각했지만 아무런 효과가 없다. –