https://www.hotelgp-osaka.com/common/js/common.js

1/**
2 * common.js
3 *
4 *  version --- 3.6
5 *  updated --- 2011/09/06
6 */
7
8
9/* !stack ------------------------------------------------------------------- */
10/* 全てのスマホで幅320px(iphone)相当に見えるようにdpiを調整 */
11jQuery(document).ready(function($) {
12  /*
13   Android の場合 DPIを調整
14  =========================================*/
15  $(window).on('resize.dpi', function () {
16
17    // 指定済みの viewport を取得
18    var BASE_PARAM = $('meta[name="viewport"]').attr('content');
19
20    // Android スマートフォンのみに適用する（タブレットも対象にしたい場合は 'Mobile' の判定を削除）
21    if (navigator.userAgent.indexOf('Android') != -1 && navigator.userAgent.indexOf('Mobile') != -1 && window.orientation === 0) {
22
23      // デバイスのスクリーンの幅を取得する
24      var width = $(window).width();
25
26      // Android の仕様でDPI基準値となる 160 で固定
27      var DEFAULT_DPI = 160;
28
29      // iPhone の幅に合わせるので 320 固定
30      // ※ガラケー基準の場合は、240 でも可
31      var DEFAULT_WIDTH = 320;
32
33      if (width !== DEFAULT_WIDTH) {
34
35        // 320px で収まる DPI を計算する
36        var dpi = DEFAULT_WIDTH / width * DEFAULT_DPI;
37

38        // 幅が正常に取得できた時だけ （dpi の値が、仕様の 70-400 に収まる）
39        // 幅が正常に取得できず DPI が異常値（70-400に入らない）になった場合に除外する
40        if (dpi >= 70 && dpi <= 400) {
41          // Androidは「target-densitydpi」プロパティで、1インチの中に何ドット表示するかを設定して調整する
42          $('head').append('<meta name="viewport" content="target-densitydpi=' + dpi + ', ' + BASE_PARAM + '" />');
43        }
44      }
45    }
46  }).trigger('resize.dpi');
47
48  pageScroll();
49  rollover();
50  common();
51});
52
53
54/* !isUA -------------------------------------------------------------------- */
55var isUA = (function(){
56  var ua = navigator.userAgent.toLowerCase();
57  indexOfKey = function(key){ return (ua.indexOf(key) != -1)? true: false;}
58  var o = {};
59  o.ie      = function(){ return indexOfKey("msie"); }
60  o.fx      = function(){ return indexOfKey("firefox"); }
61  o.chrome  = function(){ return indexOfKey("chrome"); }
62  o.opera   = function(){ return indexOfKey("opera"); }
63  o.android = function(){ return indexOfKey("android"); }
64  o.ipad    = function(){ return indexOfKey("ipad"); }
65  o.ipod    = function(){ return indexOfKey("ipod"); }
66  o.iphone  = function(){ return indexOfKey("iphone"); }
67  return o;
68})();
69
70/* !rollover ---------------------------------------------------------------- */
71var rollover = function(){
72  var suffix = { normal : '_no.', over   : '_on.'}
73  $('a.over, img.over, input.over').each(function(){
74    var a = null;
75    var img = null;
76
77    var elem = $(this).get(0);
78    if( elem.nodeName.toLowerCase() == 'a' ){
79      a = $(this);
80      img = $('img',this);
81    }else if( elem.nodeName.toLowerCase() == 'img' || elem.nodeName.toLowerCase() == 'input' ){
82      img = $(this);
83    }
84
85    var src_no = img.attr('src');
86    var src_on = src_no.replace(suffix.normal, suffix.over);
87
88    if( elem.nodeName.toLowerCase() == 'a' ){
89      a.bind("mouseover focus",function(){ img.attr('src',src_on); })
90       .bind("mouseout blur",  function(){ img.attr('src',src_no); });
91    }else if( elem.nodeName.toLowerCase() == 'img' ){
92      img.bind("mouseover",function(){ img.attr('src',src_on); })
93         .bind("mouseout", function(){ img.attr('src',src_no); });
94    }else if( elem.nodeName.toLowerCase() == 'input' ){
95      img.bind("mouseover focus",function(){ img.attr('src',src_on); })
96         .bind("mouseout blur",  function(){ img.attr('src',src_no); });
97    }
98
99    var cacheimg = document.createElement('img');
100    cacheimg.src = src_on;
101  });
102};
103/* !pageScroll -------------------------------------------------------------- */
104var pageScroll = function(){
105  jQuery.easing.easeInOutCubic = function (x, t, b, c, d) {
106    if ((t/=d/2) < 1) return c/2*t*t*t + b;
107    return c/2*((t-=2)*t*t + 2) + b;
108  };
109  $('a.scroll, .scroll a').each(function(){
110    $(this).bind("click keypress",function(e){
111      e.preventDefault();
112      var target  = $(this).attr('href');
113      var targetY = $(target).offset().top;
114      var parent  = ( isUA.opera() )? (document.compatMode == 'BackCompat') ? 'body': 'html' : 'html,body';
115      $(parent).animate(
116        {scrollTop: targetY },
117        400
118      );
119      return false;
120    });
121  });
122  $(window).scroll(function(){
123    scroll_menu();
124  });
125  function scroll_menu(){
126    var scrollTop  = parseInt($(document).scrollTop());
127    if(scrollTop > 150) {
128      $('.active').fadeIn();
129    } else {
130      $('.active').fadeOut();
131    }
132  }
133  $('.active a.pagetop').click(function(){
134    $('html,body').animate({scrollTop: 0}, 'slow','swing');
135    return false;
136  });
137}
138
139
140
141/* !common --------------------------------------------------- */
142var common = (function(){
143  $('.languagetoggle').on('click',function(){
144    var target = $(this).data('target');
145    if($(target).hasClass("on")){
146      $(target).stop().slideUp(200).removeClass("on");
147      $(this).removeClass("on");
148    }else{
149      $(target).stop().slideDown(200).addClass("on");
150      $(this).addClass("on");
151    }
152
153  });
154  $(window).resize(function (event) {
155    if($('.visiblets').css('display') == 'none') {
156      var target = $('.languagetoggle').data('target');
157      $(target).hide().removeClass("on");
158      $('.languagetoggle').removeClass("on");
159    }
160  });
161
162  $(window).resize(function (event) {
163    switchImage($('.visiblets').css('display') == 'block');
164  });
165  switchImage($('.visiblets').css('display') == 'block');
166  function switchImage(isVisible_header) {
167    $('img').each(function (index) {
168      var pc = $(this).attr('src').replace('_sp.', '_pc.');
169      var ts = $(this).attr('src').replace('_pc.', '_sp.');
170      if (!isVisible_header) {
171        $(this).attr("src",pc);
172      }else {
173
174        $(this).attr("src",ts);
175      }
176    });
177  }
178  if($('.biggerlink').length > 0){
179    $('.biggerlink').biggerlink();
180  }
181
182  //スクロールが500に達したらボタン表示
183  var top = 0;
184  $(window).load(function(){
185    top =  $('#gnavsmart').offset().top;
186  });
187
188
189  $(window).scroll(function () {
190    if ($(this).scrollTop() > top) {

191      $('#gnavsmart .gnavsmartinner').addClass('fixed');
192    } else {
193      $('#gnavsmart .gnavsmartinner').removeClass('fixed');
194    }
195  });
196
197  $('.btnmenu,.btnsearch,.standard_plan_btn').click(function(){
198    var toppixs = $(window).scrollTop();
199    wn = '.' + $(this).data('tgt');
200    $(wn).fadeIn(500);
201    $('.modalbody').css('top', toppixs);
202    $('.modalbody').css('position', 'absolute');
203    // console.log(toppixs);
204  });
205  $('.close,.modalbody').click(function(){
206    var toppixs = 0;
207    $(wn).fadeOut(500);
208  });
209
210  $('.searchclose a').click(function(){
211    $('#searchinner').slideUp(200);
212    $('.searchopen').removeClass('hide');
213    $('.searchclose').addClass('hide');
214  });
215  $('.searchopen a').click(function(){
216    $('#searchinner').slideDown(200);
217    $('.searchopen').addClass('hide');
218    $('.searchclose').removeClass('hide');
219  });
220
221  if($('.newstablist').length > 0){
222    $('.newstablist a').click(function(){
223      var id = $(this).attr('href');
224      $('.newstablist a').removeClass("current");
225      $(this).addClass("current");
226      $('.newspanel').addClass('hide');
227      $(id).removeClass("hide");
228      return false
229    });
230  }
231  if($('.roomhoverbtn').length > 0){
232    $('.roomhoverbtn').stop().hover(function(){
233      $(this).find('.roomcaption').stop(true, true).fadeIn();
234    },function(){
235      $(this).find('.roomcaption').stop(true, true).fadeOut();
236    });
237  }
238
239  if($('.visiblets').css('display') == 'none') {
240    $('.inquirybox .tel a').click(function(){
241      return false;
242    });
243  }else {
244    $('.inquirybox .tel a').click(function(){
245      return true;
246    });
247  }
248  $(window).resize(function (event) {
249    if($('.visiblets').css('display') == 'none') {
250      $('.inquirybox .tel a').click(function(){
251        return false;
252      });
253    }else {
254      $('.inquirybox .tel a').click(function(){
255        return true;
256      });
257    }
258  });
259
260  $('.tablist li').click(function(){
261    var id = $(this).data('tag');
262    $('.searchpanel').addClass('hide');
263    $('#'+id).removeClass('hide');
264  });
265
266});
267
268
269$(function () {
270  // リンク形式
271  $('#company_link').click(function(){
272    // hrefで指定されたURLが別窓で開く
273    winOpen(this.href, 800, 600);
274    return false;
275  });
276
277  /**
278   * 別窓
279   * @param {string} url
280   * @param {int} width
281   * @param {int} height
282   */
283  function winOpen(url, width, height) {
284
285    // 幅上限
286    if (width > 800) {
287      width = 800;
288    }
289
290    // 高さ上限
291    if (height > 600) {
292      height = 600;
293    }
294
295    window.open(url, '_blank', 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width=' + width + ', height=' + height);
296  }
297});
298
299// 別ドメインを別タブで開く（予約エンジンは例外）
300$(document).ready( function () {
301  $("a[href^='http']").not($("a[href*='" + location.hostname + "']")).not($("a[href*='" + 'asp\.hotel-story\.ne\.jp' + "']")).attr({
302    target: '_blank',
303    rel: 'noopener',
304  });
305  $("a[href^='/bridal/']").attr({
306    target: '_blank',
307  });
308  $("a[href$='.pdf']").attr({
309    target: '_blank',
310    rel: 'noopener',
311  });
312});
313
314
315// スマートフォン表示時のFixedメニュー分の高さをfooterの下部にpaddingとして持たせる
316$(document).ready(function(){
317  var w = $(window).width();
318  if (w <= 767) {
319    var gnav_height = $('#gnavsmart').height();
320    $('#copyright').css('padding-bottom', gnav_height);
321    // $('#wovn-translate-widget').css('bottom', gnav_height);
322  }
323});
324
325// PC表示時のメガドロップダウンメニュー
326$(function () {
327  $('#gnavi ul li').hover(function() {
328    $("ul:not(:animated)", this).slideDown();
329  }, function() {
330    $("ul.child", this).slideUp();
331  });
332});
333
334
335//■PC/SPで画像を切り替える
336$(function() {
337  // 置換の対象とするclass属性。
338  var $elem = $('.js-image-switch');
339  // 置換の対象とするsrc属性の末尾の文字列。
340  var sp = '_sp.';
341  var pc = '_pc.';
342  // 画像を切り替えるウィンドウサイズ。
343  var replaceWidth = 768;
344
345  function imageSwitch() {
346    // ウィンドウサイズを取得する。
347    var windowWidth = parseInt($(window).width());
348
349    // ページ内にあるすべての`.js-image-switch`に適応される。
350    $elem.each(function() {
351      var $this = $(this);
352      // ウィンドウサイズが768px以上であれば_spを_pcに置換ã

352™ã‚‹ã€‚
353      if(windowWidth >= replaceWidth) {
354        $this.attr('src', $this.attr('src').replace(sp, pc));
355
356      // ウィンドウサイズが768px未満であれば_pcを_spに置換する。
357      } else {
358        $this.attr('src', $this.attr('src').replace(pc, sp));
359      }
360    });
361  }
362  imageSwitch();
363
364  // 動的なリサイズは操作後0.2秒経ってから処理を実行する。
365  var resizeTimer;
366  $(window).on('resize', function() {
367    clearTimeout(resizeTimer);
368    resizeTimer = setTimeout(function() {
369      imageSwitch();
370    }, 200);
371  });
372});