2013-09-24 3 views
-1

Я использую this fiddle в качестве основы для показа отзывов - поэтому, когда вы нажимаете на ссылки, показывают относительные свидетельства.Показать содержимое div на странице load

Проблема, с которой я сталкиваюсь, заключается в том, что мне нужно первое свидетельство, показывающее, когда страница загружается - в тот момент, когда пользователь должен щелкнуть ссылку, чтобы показать отзыв.

Кто-нибудь знает, как я могу это достичь?

Fiddle: http://jsfiddle.net/Fz44h/

<body> 
<div id="menu_about"> 
    <a class="link" href="#about" data-link="first"></a> &#8226; 
    <a class="link" href="#about" data-link="second">Testimonial 1</a> &#8226; 
    <a class="link" href="#about" data-link="third">Testimonial 2</a> &#8226; 
    <a class="link" href="#about" data-link="fourth">Testimonial 3</a> &#8226; 
    <a class="link" href="#about" data-link="fifth">Testimonial 4</a> 
</div> 
<div id="pages_about" class="textContainer_about"> 
    <div class="textWord_about" data-link="first"> 
     <p>Scelerisque arcu lorem porta? Porttitor ridiculus adipiscing diam nisi, turpis, aliquam tincidunt phasellus lundium! </p> 
    </div> 
    <div class="textWord_about" data-link="second"> 
     <p>Lacus auctor dapibus. Placerat massa lundium lundium in, et. In lacus augue nisi? </p> 
    </div> 
    <div class="textWord_about" data-link="third"> 
     <p>Placerat massa lundium lundium in, et. In lacus augue nisi?</p> 
    </div> 
    <div class="textWord_about" data-link="fourth"> 
     <p>Scelerisque arcu lorem porta? Porttitor ridiculus adipiscing diam nisi, turpis, aliquam tincidunt phasellus lundium!</p> 
    </div> 
    <div class="textWord_about" data-link="fifth"> 
     <p>Lacus auctor dapibus. Placerat massa lundium lundium in, et. In lacus augue nisi? </p> 
    </div> 
</div> 
<script type="text/javascript"> 
    $('.textWord_about').hide(); 
    $('.link').click(function() { 
    $('.textWord_about').hide();  
    $('.textWord_about[data-link=' + $(this).data('link') + ']').fadeIn({ 
    width: '200px' 
    }, 300); 
    }); 
</script> 

ответ

0

В вашем случае это правильно

$(function(){ 
    $($('a.link')[1]).trigger('click'); 
}); 
0

Простой

$(document).ready(function() { 
    $(".link:first").click(); 
}); 

должны это сделать.

0

Просто добавьте метод Show() и функцию document.ready

$(document).ready(function(){ 

    $('#menu_about a').first().show(); 
    //any other statement 

}); 
0

Показаны первые данные с атрибутом канальном должны сделать хитрость:

$('.textWord_about[data-link="first"]').show(); 

Код:

$('.textWord_about').hide(); 
    $('.textWord_about[data-link="first"]').show(); 
    $('.link').click(function() { 
     $('.textWord_about').hide();  
     $('.textWord_about[data-link=' + $(this).data('link') + ']').fadeIn({ 
      width: '200px' 
     }, 300); 
    }); 
0

Просто добавьте FadeIn() для первого прячась все без щелчка

<script type="text/javascript"> 
    $('.textWord_about').hide(); 

    $('.textWord_about[data-link="first"]').fadeIn({ 
    width: '200px' 
    }, 300); 

    $('.link').click(function() { 
    $('.textWord_about').hide();  
    $('.textWord_about[data-link=' + $(this).data('link') + ']').fadeIn({ 
    width: '200px' 
    }, 300); 
    }); 
</script> 
Смежные вопросы