them_jquery をクリックした後に写真のグループを左右にスライドさせるための jQuery 実装コード

コードをコピー コードは次のとおりです。

$(function () {
var page = 1;/ /ページ変数を初期化します
var i = 2;//各ページに 2 セットの画像を配置します
var $pictureShow = $(".pictures4")
var downwidth = $pictureShow.width ();// フレーム コンテンツの幅、つまり各移動のサイズを取得します
var len = $(".picturescontent4").find('ul').length;// グループの数を調べます合計で何枚の画像があります
var page_number = Math .ceil(len / i);//合計で何枚のレイアウトがあるかを調べます
$("#symbol4b").click(function () {
if (!$(".picturescontent4").is(" :animated")) {//アニメーション効果が実行されているかどうかを判断します
if (page == page_number) {//最後のページに到達しました戻る場合は、最初のページにジャンプする必要があります。
$(".picturescontent4").animate({ left: '0px' }, "slow");// を変更して最初のページにジャンプします。 left value
page = 1;
} else {
$(".picturescontent4").animate({ left: '-=' downwidth }, "slow");// 左の値を変更する、毎回 1 ページ変更できます。
page;
}
}
return false;
});
if (!$(".picturescontent4").is( ":animated")) {
if (page == 1) {//最初のページに到達しました。次に進む場合は、最後のページにジャンプ
$(".picturescontent4") .animate({ left: '-=' downwidth * (page_number - 1) }, "slow");//左を変更して最後のページにジャンプvalue
page = page_number;
} else {
$(".picturescontent4").animate({ left: ' =' downwidth }, "slow");//左の値を変更すると、
page--;
}
return
});

コードをコピーします コードは次のとおりです:

img class="picture" src="i/Picture14"/> /li>


> ;






• 
  
  
• 
  画像" src="i/Picture3.png" alt="画像 3"/>
  
gt;





• 
  
  


• 
  
  




• 
  class="picture" src="i/ Picture 9.png" alt="Picture 9"/>
  

> ;



="commona" href="#"> ;
🎜>
• 
  < ;/a>
  

コードをコピー コードは次のとおりです:

.pictures2ul1,.pictures2ul2,.pictures2ul3, .pictures2ul4、.pictures2ul5、.pictures2ul6
{
マージン-top:0px;
パディング:0px;
float:left ;
list-style-type:none;}
.pictures4
{
height:111px;
overflow:hidden;
}
.picturescontent4 //位置を設定した後、JavaScript で左のコントロールを使用できるようになります。
{
位置:絶対;
幅:834px;