jQuery(bxslider)でスライダープラグインを使用しています。私のページが初めて読み込まれたとき、スライダー クラスには、displayHomeLine() 関数を使用してデフォルトのリスト要素が読み込まれます。次に、jquery ロードを使用して別の php を呼び出し、スライダー クラス (ul 要素と li 要素) のコンテンツ全体を置き換えます。正常に読み込まれますが、アニメーション化されず、代わりにデフォルトの順序付けられていないリストが表示されます。私の質問は、最初のページの読み込み時にデフォルトのコンテンツと同じようにスライダーをアニメーション化することは可能ですか? ページを更新したくないので、他のオプションは何ですか? 私のコード:
<body>
<center>
<?php
function displayHomeTimeline(){
$home_timeline=$_SESSION['home_timeline'];
foreach($home_timeline as $item){
echo '<li>'.$item->text.'</li>';
}
}
?>
<div id="page_content">
<h1>Welcome <?php echo $_SESSION['screen_name']?></h1>
<ul id="sections">
<li style="width:550px;"><h2>Tweets</h2>
<!-- Slider -->
<div id="wrapper_slider">
<ul class="bxslider">
<?php displayHomeTimeline();?><--Loads the default content
</ul>
</div>
</li>
<li style="width:180px;">
<h2>Followers</h2>
</li>
</ul>
</div>
</center>
<script type="text/javascript">
//function to populate the slider with follower's tweets
function populateFollowersTweets(screen_name){
//THIS IS THE CALL TO OTHER FILE WHICH CREATES THE CLASS FOR SLIDER
$('#wrapper_slider').load('follower_status.php?sname='+screen_name+'');
//for tweets slider
//TRIED PUTTING EXPLICIT CALL STILL DOESN"T ANIMATE
$('.bxslider').bxSlider({
auto:true});
}
$(document).ready(function(){
//for tweets slider
$('.bxslider').bxSlider({
auto:true});
//for populating follower's tweets in the slider
$('#followers_list>li').click(function(){
//FUNCTION TO REPLACE THE CONTENT WITH NEW BXSLIDER CLASS
populateFollowersTweets($(this).text());
});
});
</script>
</body>
BXSlider の同一の順不同リストを作成するファイル: follower_status.php
<?php
require("lib/twitteroauth/twitteroauth.php");
session_start();
//function to print user timelines
function getUserTimeline($screen_name){
$oauth_token = $_SESSION['oauth_token'];
$oauth_token_secret = $_SESSION['oauth_token_secret'];
$connection = new TwitterOAuth('xxx', 'xxx', $oauth_token, $oauth_token_secret);
$tweets=$connection->get('statuses/user_timeline',array('screen_name' => $screen_name, 'count' => 10));
foreach($tweets as $item){
echo '<li>'.$item->text.'</li>';
}
}
$screen_name=$_GET['sname'];
echo '<ul class="bxslider">';
getUserTimeline($screen_name);
echo '</ul>';
?>
スクリーンショットは私の疑問をよりよく表しているはずです。これは、デフォルトのコンテンツがロードされたときのスライダーです:
load 関数を呼び出してスライダー クラスを follower_status.php に置き換えると、次のようになります。