WPサイト奮闘記4-galleryviewの基準位置の変更

jQuery,easing,timerと一緒に、galleryview を使用して、
画面下部のサムネールが断続的に横スクロール、
画面上部の大きな画像がそれに応じて変わるというものがある。
左端のサムネールが基準位置(ここのサムネールの対応する大きな画像が表示される)になっている。

基準位置を中央(左端より3番目)に変えたい。
そのため、galleryview.js を何ヶ所か変更

  1.表示及び位置調整の showItem(i) 内
   if (i>item_count) { → if (i>item_count + 2) {
i = i%item_count;
iterator = i;
j_filmstrip.css(‘left’,’-‘+((opts.frame_width+frame_margin)*i)+’px’);

j_filmstrip.css(‘left’,’-‘+((opts.frame_width+frame_margin)*(i-2))+’px’);
} else if (i<=(item_count-strip_size) + 2) {
i = (i%item_count)+item_count;
iterator = i;
j_filmstrip.css(‘left’,’-‘+((opts.frame_width+frame_margin)*(i-2))+’px’);
  2.buildFilmstrip() 内 で id =”pointer” の位置を変更
    var pointer = $(‘<div></div>’);
pointer.attr(“id”,’pointer’).appendTo(j_gaiilery).css({
“position”:absolute’,
“zIndex”:’1000′,
“cursor”:’pointer’,
// 白枠を中央に持ってくるため 0 → 2 に変更
“top”:getPos(j_frames[2]).top-(pointer_width/2)+’px’,
“left”:getPos(j_frames[2]).left-(pointer_width/2)+’px’,
  3. Initiate Automated Animation 部分
// Show the first panel
jpanels.eq(0).show(); → jpanels.eq(2).show();
iterator += 2; // 挿入

以上の8ヶ所の変更が必要

大きな画像下部のタイトルやコメントの黒地を消したいときは、
galleryview.js の一番下で設定している default 値の
    overlay_opacity: 0.6; → 0 に変更
  

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です