2013-08-11 2 views
1

EDIT: Я обновил js до примера, приведенного ниже, «Front End Buy», и теперь мои ссылки не работают. Ive отредактировал мой оригинальный пост, чтобы показать, что я сейчас использую. Любая идея, почему ссылки больше не работают?Div, чтобы исчезнуть, но не верхний и нижний колонтитулы

Im пытается получить мой основной контент, чтобы исчезнуть без замирания заголовка и нижнего колонтитула. ниже мой код. ниже мой код, который я создал. У меня есть внешний вызов библиотеки jquery в моем заголовке. Благодаря

<script> 
$(document).ready(function() { 
    var linkLocation = null; 
    $("#content").hide().fadeIn(2000); 
    $("a.transition").click(function(event){ 
    event.preventDefault(); 
    linkLocation = this.href; 
    $("#content").fadeOut(1000, function() { 
     redirectPage(); 
    });  
    }); 
    function redirectPage() { 
    window.location = linkLocation; 
    } 
}); 
</script> 


<body> 
<div id="content_wrapper"> 

    <div id="header"> 

     <div id="logo"></div>   

     <div id="nav"> 
      <ul id="nav" class="nav"> 
       <li id="home"><a href="index.html" title="" class="transition">Home</a></li>    
       <li id="about"><a href="about.html" title="About Us" class="transition">About Us</a></li> 
       <li id="contact"><a href="contact.html" title="Contact Us" class="transition">Contact Us</a></li>     
      </ul> 
     </div> 

    <!--End Main Nav-->   

    </div> 
    <!-- End of Content Header --> 
    <div id="content"> 
    some text etc... 
    </div> 
    <div id="footer"></div> 
</div> 
</body> 
+1

Если вы используете правильный селектор, как в '$ ('# content')', который должен работать нормально? – adeneo

+0

Также нет никакой причины запрашивать несколько раз для #content, поскольку это не динамический контент. И .hide обрабатывает свойство отображения, вам не нужно менять его на none. – Virus721

ответ

0

content является элементом в ID, так что вы должны предварить селектор с #, как это:

$('#content').hide().fadeIn(2000); 
+0

Когда я меняю свой сценарий на следующие, мои ссылки больше не работают. <тип скрипта = "текст/JavaScript"> $ (документ) .ready (функция() { $ ("# содержание") скрыть() FadeIn (2000);.. $ ("a.transition") нажмите (функция (событие) { event.preventDefault(); linkLocation = this.href; $ ("# содержание") Затухание (1000, redirectPage). }.); function redirectPage() { window.location = linkLocation; } }); – dom

+0

Вам нужно создать jsFiddle, если вы серьезно относитесь к помощи в этом. – DevlshOne

0

Есть несколько ключевых вещей, отсутствует с JS. Во-первых, убедитесь, что вы добавили # в начало своих идентификаторов. Во-вторых, вы хотите создать variable для местоположения ссылки, чтобы он знал, что находится во второй функции. Например:

$(document).ready(function() { 
    var linkLocation = null; // Create a variable for the link location. 
    $("#content").hide().fadeIn(2000); 
    $("a.transition").click(function(event){ 
    event.preventDefault(); // prevent the default action from happening. 
    linkLocation = this.href; 
    $("#content").fadeOut(1000, function() { // on complete, redirect the page. 
     redirectPage(); 
    });  
    }); 
    function redirectPage() { 
    window.location = linkLocation; 
    } 
}); 

CodePen для этого в действии.

+0

Я отредактировал мой оригинальный код к тому, что предложил Front End Guy. Теперь мои ссылки больше не работают. – dom

+0

Я получил его на работу !!! БЛАГОДАРЯ!!!! – dom

+0

Рад, что я мог помочь. Пожалуйста, отметьте, что ответ принят. :) –

Смежные вопросы