Динамическая галлерея
Здравствуйте!
Подскажите, пожалуйста, как можно сделать такую галлерею, чтобы при помощи JS пользовтель мог удалять из нее не нужные ему картинки, а потом кнопкой "Восстановить" все изображения восстанавливались. Кнопка "Восстановить" одна для всей галлереи. Например, есть следующий код: <section id="least"> <ul class="least-gallery"> <li> <a class="photo" href="images/big/1.jpg"> <img class="red small" src="images/small/1.jpg" alt="" width="160" height="160" /> </a> </li> <li> <a class="photo" href="images/big/2.jpg"> <img class="small" src="images/small/2.jpg" alt="" width="160" height="160" /> </a> </li> <li> <a class="photo" href="images/big/3.jpg"> <img class="small" src="images/small/3.jpg" alt="" width="160" height="160" /> </a> </li> </ul> </section> <a href="#" class="but1"/>Восстановить</a> |
Например
<section id="least"> <ul class="least-gallery" id="ulGallery"> <li> <a class="photo" href="images/big/1.jpg"> <img class="red small" src="images/small/1.jpg" alt="" width="160" height="160" /> </a> <button>Delete</button> </li> <li> <a class="photo" href="images/big/2.jpg"> <img class="small" src="images/small/2.jpg" alt="" width="160" height="160" /> </a> <button>Delete</button> </li> <li> <a class="photo" href="images/big/3.jpg"> <img class="small" src="images/small/3.jpg" alt="" width="160" height="160" /> </a> <button>Delete</button> </li> </ul> </section> <a href="#" class="but1" id="restoreLink">Восстановить</a> <script> var gallery = document.getElementById('ulGallery'); li = gallery.getElementsByTagName('li'); for ( var i = 0; i < li.length; i++) { li[i].addEventListener('click',function(e){ var e = e || window.event; target = e.target || e.srcElement; target.parentNode.style.display = 'none'; }, true ) } var restore = document.getElementById('restoreLink'); restore.addEventListener('click',function(e){ var e = e || window.event; for ( var i = 0; i < li.length ; i++) { li[i].style.display = 'block'; } e.preventDefault(); },false) </script> |
Спасибо большое)
|
Часовой пояс GMT +3, время: 06:29. |