Загрузка Javascript на странице

Question

Я хочу, чтобы название и субтитры отображались при загрузке страницы. Я несколько раз пытался, чтобы это работало, но это не так.

jQuery(document).ready(function(){     

jQuery('.element').bind('mouseover', function() { 
    jQuery(this).find('img').stop().each(function() { 
     jQuery(this).animate({ 
     'opacity': 1 
     }, 200); 
    }); 
}); 

    jQuery('.element').bind('mouseout', function() { 
    jQuery(this).find('img').stop().each(function() { 
     jQuery(this).animate({ 
     'opacity': 0.4 
     }, 200); 
    }); 
}); 


    jQuery('.element').on('pageload', function() { 
    jQuery(this).find('.title').stop().each(function() { 
     jQuery(this).animate({ 
     'margin-left': 35, 
     'opacity': 1 
     }, 250); 
    }); 
    jQuery(thi2s).find('.subtitle').stop().each(function() { 
     jQuery(this).animate({ 
     'opacity': 1 
     }, 0); 
     jQuery(this).delay(150).animate({ 
     'margin-left': 35 
     }, 250); 
    }); 
    }); 

});

Может кто-нибудь помочь мне с этой проблемой?

Answer 1

Это не совсем понятно, что вы пытаетесь сделать, но на первый взгляд, я заметил эту ошибку:

jQuery(thi2s).find('.subtitle').stop().each(function() { 
    // code 
} 

Очевидно, что постороннее «2» не должно быть там, но я не если это небольшое исправление создаст предполагаемое поведение, которое вы ищете.

Вот пример того, как вы должны структурировать свой код. Вы не должны использовать функцию .bind() для своих событий или контрольных элементов, используя jQuery('.element'). Кроме того, чрезмерное использование this не является необходимым и усложняет ваш код.

Рассмотрим простой пример:

$(document).ready(function() { 

    $("div").hover(
    function() { 
     $("h2").animate({ 
      left: 50, 
      opacity: 1 
     }, 500); 
    }, function() { 
     $("h2").animate({ 
      left: 50, 
      opacity: 0.2 
     }, 500); 
    }); 

}); 

ЗАКАНЧИВАТЬ this JSFiddle.

Надеюсь, это поможет!