2012-04-25 180 views
0

因此,我建立了一個小網站:http://rolandgroza.com/projects/tcsg/,但它似乎有一個問題,我沒有遇到將文件移動到服務器之前。我通常在部署到服務器之前在本地主機上進行測試,所以我只在我做之後纔看到問題。JavaScript重定向它不在服務器上工作,但在本地主機上?

你可以看到在源代碼中我的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本地主機上工作正常。

+0

你確定你的css文件的路徑是正確的嗎?在Firefox中打開網址時我沒有看到它們。 – Roger 2012-04-25 14:53:42

+0

css文件與'location.href'有什麼關係?我正在與LESS合作,但CSS在那裏我向你保證,因爲一切看起來都不錯,至少在Chrome中,我還沒有在其他瀏覽器上測試過。 – Roland 2012-04-25 14:56:46

+0

我沒有回答這個問題,只是想知道CSS在哪裏。刷新後,我看到圖形。 (看起來不錯)。該頁面加載速度較慢,Firefox正在拋出有關腳本繁忙的錯誤。 – Roger 2012-04-25 15:03:11

回答

1

問題是,當你詢問當前頁面,並在你的主頁上,當index.php不在url中時,你缺少的東西和你的開關箱無法工作。在導航欄中添加一個沒有頁面或頁面==''的情況下,它會知道該怎麼做。希望有所幫助!

+0

好的,讓我試試,但爲什麼這隻發生在服務器上,而不是在本地主機上? – Roland 2012-04-25 15:11:40

+0

是的,這是問題所在,我忘記了在請求根目錄時沒有頁面地址:)我之前遇到過這個問題,我忘了:)謝謝你指出它@mlantz。 – Roland 2012-04-25 15:17:14

+0

也許它與htaccess有關?在我之前,我遇到了問題。 – mlantz 2012-04-25 15:21:36

相關問題