Jump to content
  • 0

Подгрузка изображений без перезагрузки страницы (ajax)


okunev2
 Share

Question

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

Нашел пример и класс JsHttpRequest, но ничерта непонятно, если бы подсказали что именно прописывать в тег превью img и что прописывать в тег большой фото?

Сенк заранее, если кто подскажет ;)

Link to comment
Share on other sites

12 answers to this question

Recommended Posts

  • 0
если бы подсказали что именно прописывать в тег превью img и что прописывать в тег большой фото?

src прописывать. А Ajax оставь ламеров пугать, он здесь не к чему.

Зачем было писать ;) не флудите, подскажите

Link to comment
Share on other sites

  • 0

Хорший пример кода ? сделаный собственными руками под свои собственный нужды.

<img src="/img/big/1.jpg" alt="Большая картинка" id="BigImage" />

<img src="/img/small/1.jpg" big="/img/big/1.jpg" alt="" onclick="return SetBigImage(this);" />
<img src="/img/small/2.jpg" big="/img/big/2.jpg" alt="" onclick="return SetBigImage(this);" />
<img src="/img/small/3.jpg" big="/img/big/3.jpg" alt="" onclick="return SetBigImage(this);" />
<img src="/img/small/4.jpg" big="/img/big/4.jpg" alt="" onclick="return SetBigImage(this);" />
<img src="/img/small/5.jpg" big="/img/big/5.jpg" alt="" onclick="return SetBigImage(this);" />

<script type="text/javascript">
function SetBigImage(el) {
document.getElementById('BigImage').src = el.getAttribute('big');
}
</script>

Link to comment
Share on other sites

  • 0
Спасибо за тот код, но всетаки охото внятный пример того класа переварить ;)

Так твоя задача разобраться с JsHttpRequest или сделать то, что ты описал в первом посте? Если первое, то зачем ты голову морочишь, спрашивая того что тебе не нужно?

Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
 Share

  • Обсуждения

    • Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com Портфолио https://www.behance.net/d4d4186e Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ    
    • Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com   Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ   Портфолио https://www.behance.net/d4d4186e
    • Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение.  .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } }  
    • Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy