JavaScriptはサーバー上で動作していませんが、localhost上でリダイレクトされていますか？

Question

私は小さなウェブサイトを構築しました：http://rolandgroza.com/projects/tcsg/しかし、ファイルをサーバーに移動する前に遭遇していない問題があるようです。私は通常、サーバにデプロイする前にlocalhostでテストしていますので、私はその問題を見ただけです。

あなたは、ソースコードに私のJavaScriptのスクリプトを見ることができますが、私もここでそれを配置することだ：

$(document).ready(function() { 

var header = $('body').find('header'); 
var footer = $('body').find('footer'); 
var badge = $('body').find('.badge-wrapper'); 

var logo_red = $(header).find('.logo a'); 

var navigation = { 
    home:  $('body').find('.home'), 
    about:  $('body').find('.about'), 
    services: $('body').find('.services'), 
    contact: $('body').find('.contact') 
} 

var container = { 
    home:  $('body').find('.content-home-wrapper'), 
    about:  $('body').find('.content-about-wrapper'), 
    services: $('body').find('.content-services-wrapper'), 
    contact: $('body').find('.content-contact-wrapper') 
} 

var home = { 
    form:  $(container.home).find('.form-wrapper'), 
    galleries: $(container.home).find('.galleries-wrapper') 
} 

var about = { 
    notepad: $(container.about).find('.notepad-wrapper') 
} 

var services = { 
    minimum: $(container.services).find('.minimum-package'), 
    medium:  $(container.services).find('.medium-package'), 
    featured: $(container.services).find('.featured-package') 
} 

var contact = { 
    notepad: $(container.contact).find('.notepad-wrapper') 
} 

var position = function (obj) { 
    return { 
     'top': (($(window).height() - $(obj).outerHeight())/2) + 'px', 
     'left': (($(window).width() - $(obj).outerWidth())/2) + 'px' 
    } 
} 

var current_page = function() { 
    var path = window.location.pathname; 
    var current_page = path.substring(path.lastIndexOf('/') + 1); 
    return current_page; 
} 

var curr_pag = current_page(); 

switch (curr_pag) { 
    case 'index.php': 
     $(navigation.home).addClass('selected'); 
     break; 
    case 'about.php': 
     $(navigation.about).addClass('selected'); 
     break; 
    case 'services.php': 
     $(navigation.services).addClass('selected');    
     break; 
    case 'contact.php': 
     $(navigation.contact).addClass('selected'); 
     break; 
    default: 
     break; 
} 

$(logo_red).on('click', function() { 
    var page = current_page(); 
    switch (page) { 
     case 'index.php': 
      $(home.form).removeClass('animated flipInX'); 
      $(home.galleries).removeClass('animated flipInX'); 
      $(home.form).addClass('animated fadeOutLeftBig'); 
      $(home.galleries).addClass('animated fadeOutRightBig'); 
      setTimeout(function(){ 
       window.location.href = 'index.php'; 
      }, 2000); 
      break; 
     case 'about.php': 
      $(about.notepad).removeClass('animated flipInX'); 
      $(about.notepad).addClass('animated flipOutX'); 
      setTimeout(function(){ 
       window.location.href = 'index.php'; 
      }, 2000); 
      break; 
     case 'services.php': 
      $(services.minimum).removeClass('animated flipInY'); 
      $(services.medium).removeClass('animated flipInY'); 
      $(services.featured).removeClass('animated flipInY'); 
      $(services.minimum).addClass('animated fadeOutLeftBig'); 
      $(services.medium).addClass('animated fadeOutDownBig'); 
      $(services.featured).addClass('animated fadeOutRightBig'); 
      setTimeout(function(){ 
       window.location.href = 'index.php'; 
      }, 2000); 
      break; 
     case 'contact.php': 
      $(contact.notepad).removeClass('animated flipInX'); 
      $(contact.notepad).addClass('animated flipOutX'); 
      setTimeout(function(){ 
       window.location.href = 'index.php'; 
      }, 2000); 
      break; 
     default: 
      break; 
    } 
    e.preventDefault(); 
}) 

for(var key in navigation) { 
    var object = navigation[key]; 
    $(object).on('click', function(e){ 
     var link = $(this).attr('href'); 
     $(this).addClass('animated hinge'); 
     var page = current_page(); 
     switch (page) { 
      case 'index.php': 
       $(home.form).removeClass('animated flipInX'); 
       $(home.galleries).removeClass('animated flipInX'); 
       $(home.form).addClass('animated fadeOutLeftBig'); 
       $(home.galleries).addClass('animated fadeOutRightBig'); 
       setTimeout(function(){ 
        window.location.href = link; 
       }, 2000); 
       break; 
      case 'about.php': 
       $(about.notepad).removeClass('animated flipInX'); 
       $(about.notepad).addClass('animated flipOutX'); 
       setTimeout(function(){ 
        window.location.href = link; 
       }, 2000); 
       break; 
      case 'services.php': 
       $(services.minimum).removeClass('animated flipInY'); 
       $(services.medium).removeClass('animated flipInY'); 
       $(services.featured).removeClass('animated flipInY'); 
       $(services.minimum).addClass('animated fadeOutLeftBig'); 
       $(services.medium).addClass('animated fadeOutDownBig'); 
       $(services.featured).addClass('animated fadeOutRightBig'); 
       setTimeout(function(){ 
        window.location.href = link; 
       }, 2000); 
       break; 
      case 'contact.php': 
       $(contact.notepad).removeClass('animated flipInX'); 
       $(contact.notepad).addClass('animated flipOutX'); 
       setTimeout(function(){ 
        window.location.href = link; 
       }, 2000); 
       break; 
      default: 
       break; 
     } 
     e.preventDefault(); 
    }) 
} 

$(badge).hover(
    function(){ 
     $(this).addClass('animated swing'); 
    }, 
    function(){ 
     $(this).removeClass('animated swing'); 
    } 
); 

setTimeout(function(){ 
    $(header).addClass('animated fadeInDown'); 
    $(footer).addClass('animated fadeInUp'); 
    $(badge).addClass('animated swing'); 
}, 1000); 

setTimeout(function(){ 
    $(home.form).addClass('animated flipInX'); 
    setTimeout(function(){ 
     $(home.galleries).addClass('animated flipInX'); 
    }, 500); 
}, 2000); 

setTimeout(function(){ 
    $(about.notepad).addClass('animated flipInX'); 
}, 2000); 

setTimeout(function(){ 
    $(services.minimum).addClass('animated flipInY'); 
    setTimeout(function(){ 
     $(services.medium).addClass('animated flipInY'); 
     setTimeout(function(){ 
      $(services.featured).addClass('animated flipInY'); 
     }, 500); 
    }, 500); 
}, 2000); 

setTimeout(function(){ 
    $(contact.notepad).addClass('animated flipInX'); 
}, 2000); 

for(var key in container) { 
    var object = container[key]; 
    var css = position(object); 
    $(object).css(css); 
} 

$('select').dropkick(); 

}); 

問題は、メニューのリンクのいずれかをクリックすると、その後起こって、いくつかのアニメーションがなければならないということですあなたがクリックしたリンクにwindow.location.hrefでリダイレクトされていますが、ほとんど何も動作しません。

問題が何であるかわからないので、XAMPP localhost上でうまく動作するため、誰かができることを期待しています。

Answer 1

問題は、index.phpがあなたの欠けているものとあなたのスイッチケースが動作していないURLにないときに、現在のページとあなたのホームページに尋ねることです。ナビゲーション内のスイッチ機能に、ページやページ== ''を持たないケースを追加して、何をすべきかを知ることができます。希望が助けてくれる！