JQuery ползунок коробки

Question

Не уверен, является ли это проблемой javascript или может быть решена с помощью CSS.

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

http://www.warface.co.uk/clients/detail-shoppe/directors

Большое спасибо

Answer 1

Просто включите эту строку, которая устанавливает исходное значение css, чтобы два .cover div были «скрыты»

$('.boxgrid.captionfull .cover').css('top', 240);

вот так

...
$(document).ready(function(){
    $('.boxgrid.captionfull .cover').css('top', 240);
    //Full Caption Sliding (Hidden to Visible)
...

Answer 2

Вы можете просто добавить начальное значение top к вашему CSS, например так:

.boxcaption{
  top: 240px;     /* add this! */
  float: left;
  ....
 }

Это должно дать вам начальный эффект, который вы хотите, и при наведении курсора он скользит вверх по первомупарения.