Как я могу использовать jQuery для создания хеша с закладками? - PullRequest
Новая
       22

Как я могу использовать jQuery для создания хеша с закладками?

4 голосов
/ 18 августа 2010

У меня есть один URL, который я использую в качестве галереи изображений.По этому URL-адресу есть большие пальцы div (для краткости я показываю только четыре больших пальца): 

 <div id="thumbs">
 <img src="graphics/thumbs/01.jpg" width="190" height="190" class="thumb objects" id="project01" />
 <img src="graphics/thumbs/08.jpg" width="190" height="190" class="thumb web" id="project08" />
 <img src="graphics/thumbs/14.jpg" width="190" height="190" class="thumb freehand" id="project14"/>
 <img src="graphics/thumbs/04.jpg" width="190" height="190" class="thumb freehand objects" id="project04" /></div>

И пустой div с именем #content: 

<div id="content"></div>

и скрытый div с именем #preload: 

 <div id="preload">
<span id="project01_content"><img src="graphics/010.jpg" /></span>
<span id="project02_content"><img src="graphics/022.jpg" /><img src="graphics/021.jpg" /><img src="graphics/023.jpg" /><img src="graphics/020.jpg" /></span>
<span id="project03_content"><img src="graphics/030.jpg" width="450" height="600" /><img src="graphics/031.jpg" width="450" height="600" /></span>
<span id="project04_content"><img src="graphics/040.jpg" width="775" height="600" /><img src="graphics/041.jpg" width="775" height="600" /></span></div>

Мой jQuery использует идентификатор нажатой миниатюры для clone() изображений из соответствующих span и перетаскивания их в #content используя html() метод.Работает отлично.Теперь я хотел бы вернуться к mysite.com/#project01 и уже заполнить #content проектом 01.

Как я могу дать каждому изображению хешированный URL, который будет вызывать одно и то же состояние jQuery?

1 Ответ

3 голосов
/ 18 августа 2010

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

$(function() {
  if(window.location.hash.indexOf('project') > -1)
    $(window.location.hash).click();
});

При этом используется свойство window.location.hash который будет "#project01" в вашем примере URL ... так что это уже селектор #ID , мы просто проверяем, что это хеш, о котором мы заботимся, а затем используем этот селектор для запуска .click().Просто убедитесь, что он запускается после ваш текущий обработчик кликов для больших пальцев привязан.

...