2011-09-15 52 views
0

我想加載一個jquery innerfade函數加載的內容由jquery .load函數,我已經看到很多類似這樣的話題,但因爲我很新的JavaScript我不能得到正確的解決方案。jquery innerfade裏面ajaxed內容

這我使用加載腳本內容:

$(document).ready(function() { 

// Check for hash value in URL 
var hash = window.location.hash.substr(1); 
var href = $('.nav li a').each(function(){ 

    var href = $(this).attr('href'); 
    if(hash==href.substr(0,href.length-5)){ 
     var toLoad = hash+'.php #content'; 
     $('#content').load(toLoad) 
    } 
}); 

$('.nav li a').click(function(){ 

var toLoad = $(this).attr('href')+' #content'; 
$('#content').hide('fast',loadContent); 


$('#load').remove(); 
$('#sub_corpo').append('<span id="load">sto caricando il contenuto...</span>'); 
$('#load').fadeIn('normal'); 
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5); 



function loadContent() { 
    $('#content').load(toLoad,'',showNewContent()) 

} 
function showNewContent() { 
    $('#content').show('normal',hideLoader()); 


} 
function hideLoader() { 
    $('#load').fadeOut('normal'); 
} 
return false; 

}); 

});

,這是innerfade功能:

<script > 
function(){ 

$('#slideshow').innerfade({ 
     speed: 4500, 
     timeout: 6000, 
     type: 'sequence', 
     containerheight: '480px' 
     }); 
} 
</script> 

我不知道如何加載內容時調用這個函數。我非常感謝你的建議。

Dimtiri

回答

0

這應該是答案:

$('#content').load(toLoad, function() { 
    $('#slideshow').innerfade({ 
     speed: 4500, 
     timeout: 6000, 
     type: 'sequence', 
     containerheight: '480px' 
     }); 
}); 
+0

謝謝肖恩,但它不工作... – Dimitri

0

感謝您的建議,我測試過它,但它似乎並沒有工作。 這是新的最終jQuery代碼:

$(document).ready(function() { 

// Check for hash value in URL 
var hash = window.location.hash.substr(1); 
var href = $('.nav li a').each(function(){ 

    var href = $(this).attr('href'); 
    if(hash==href.substr(0,href.length-5)){ 
     var toLoad = hash+'.php #content'; 
     $('#content').load(toLoad, function() { 
     $('#slideshow').innerfade({ 
     speed: 4500, 
     timeout: 6000, 
     type: 'sequence', 
     containerheight: '480px' 
     }); 
     }); 
    } 
}); 

$('.nav li a').click(function(){ 

var toLoad = $(this).attr('href')+' #content'; 
$('#content').hide('fast',loadContent); 


$('#load').remove(); 
$('#sub_corpo').append('<span id="load">sto caricando il contenuto...</span>'); 
$('#load').fadeIn('normal'); 
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5); 



function loadContent() { 
    $('#content').load(toLoad,'',showNewContent()) 

} 
function showNewContent() { 
    $('#content').show('normal',hideLoader()); 


} 
function hideLoader() { 
    $('#load').fadeOut('normal'); 
} 
return false; 

}); 

}); 

爲了給更多的相關信息,這是一個應該通過jQuery加載到「內容」分區的頁面代碼:

<div id="content"> 
<div class="sub_corpo"> 
<div class="sub_sinistra"> 

<div id="slideshow"> 

<?php 

$args = array(
'post_type' => 'attachment', 
'numberposts' => -1, 
'post_mime_type' => 'image', 
'post_status' => null, 
'post_parent' => $post->ID 
); 
$images = get_posts($args); 
foreach($images as $image): 
echo wp_get_attachment_image($image->ID, 'full'); 
endforeach; ?></div> 



<h1>Lunarossa vini e passione</h1> 
<p> 
<?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
<?php the_content(); ?> 
<?php endwhile; else: ?> 
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p> 
<?php endif; ?> 
</p> 
</div> 
<div class="sub_destra"><img src="http://www.viniepassione.it/wp-content/uploads/2011/09/parco.jpg" alt="Monti Picentini" /> 
<h1>&nbsp;</h1> 
<p>I monti piacentini sono un gruppo montuoso dell'Appennino campano. I Monti picentini sono una terra il cui carattere morfologico &egrave; rimasto immutato nel tempo, cos&igrave; come le tipicit&agrave; gastronomiche, dalla nocciola Tonda di Giffoni al''olio delle colline salernitane ottenuto dalla spremitura dell'oliva Rotondella. Nel &quot;Parco regionale dei piacentini&quot; ricadono due oasi WWF, quella del monte Accellica e quella del Polveracchio. 
</p> 
</div> 
</div> 
</div> 

謝謝爲你的時間和幫助