Динамически заменяемый контент прокручивается по горизонтали

Question

Пока у меня есть страница динамического индекса с навигацией, которая заменяет содержимое.

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

На этой странице http://intelligen.info/test/index.html вы можете увидеть страницу динамического индекса, которая заменяет содержимое. Я нашел код из этого блога http://css-tricks.com/dynamic-page-replacing-content/

Контент - это изображения, которые можно перемещать по горизонтали, чтобы перейти к следующему изображению. Изображения прокручиваются точно на индексной странице, но не работают с контентом при его замене. например, см. эту страницу http://intelligen.info/test/index.html#paul-smith.html Однако эта ссылка на страницу paul smith не загружает контент вообще. Возможно, вам придется нажать «work»> «london fashion week»> «paul smith», чтобы просмотреть эту страницу.

Как получить прокрутку изображений на заменяемом содержимом?

Answer 1

Вы зарегистрировав hashchange

$(window).bind('hashchange', function(){ 

но вы также использовали # на изображениях якорей

<div id="image-1"> 
    <a href="#image-2"><img></a> <!-- HERE'S THE ISSUE --> 
</div> 

который после щелчка вызовет то же событие.

так что вы должны думать о вашей странице практичности и UI (пользовательского интерфейса).
Это не часто, что пользователь нажмет на изображение, чтобы сделать контент-слайдер вперед ...

Одним из решений было бы переосмыслить о концепции, я хотел бы добавить два хороших фантазии стрелки на обеих сторонах листа - слайдер.

или вы можете event.preventDefault() на любом клике, который срабатывает на изображениях

$("#main-content").on("click", "a[href^='image-']", function(event){ 
    event.preventDefault(); 
}); 

надеюсь, предотвращая hashchange событие, чтобы вызвать. Надеюсь, это помогло выявить проблему.

_{PS: меню на левой стороне также неинтуитивными, не ясно, который открывается подменю, и который был родительский вызывающий ...}