Jump to content


Photo
- - - - -

Модальное окно добавления товара в корзину (заменяем полёт)

220v

11 replies to this topic

#1 isay777

isay777
  • JBZoo User (rus)
  • User rate: 113.4
  • posts: 1878
  • topics: 232

Posted 29 April 2015 - 10:59

*
POPULAR

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

 

Всякие "приблуды" типа полета в корзину довольно трудоёмки и иногда работают криво, особенно на мобильных устройствах. 

Но теперь у нас есть вшитый sweet alert  и нам теперь легко можно сделать всплывающие окно с сообщением о попадании товара в корзину.

 

Приступим

==============================================

Идем в js отвечающий за кнопки 

jbuniversal/cart-elements/price/buttons/assets/js/buttons.js

нам нужна эта строка 

5coc.png

 

Пишем свой код для окна по образцам на сайте свит алерт, я сделал так 

swal( {title: "Товар добвлен в корзину!",type:"success", timer: 2000,   showConfirmButton: false });

Теперь вставляем его в js 

должно получиться примерно так 

'click .jsAddToCart': function (e, $this) {

                var jbPrice = $this.price.data('JBZooPrice'),
                    quantity = $this.get('quantity', 1),
                    input = $(this);
                swal( {title: "Товар добвлен в корзину!",type:"success", timer: 2000,   showConfirmButton: false });

И вот что у нас выходит. 

 

l2qhxh13vxyx.gif

 


  • 13
ХОСТИНГ для сайтов jbzoo (все попугаи)

#2 andrey.koch

andrey.koch
  • JBZoo User (rus)
  • User rate: 16.4
  • posts: 444
  • topics: 86

Posted 30 April 2015 - 20:01

Отличненько (yes)  После перехода на 220 обязательно воспользуюсь рецептом. Спасибо.


  • 0

#3 laRus

laRus
  • JBZoo User (rus)
  • User rate: 60
  • posts: 1334
  • topics: 31

Posted 13 May 2015 - 02:17

Спасибо, isay777! Стильно и есть возможность для экспериментов.  :)


  • 1
..minimum effort for maximum effect? - Oh yeah! It's good!..

#4 Save Tibet

Save Tibet
  • JBZoo User (rus)
  • User rate: 0.1
  • posts: 510
  • topics: 75

Posted 28 May 2015 - 13:14

А разве по-умолчанию в 220v не внедрено сообщение о добавлении? И судя по скриншоту с кодом, в том куске уже есть какое-то упоминание модального окна? Или я не прав?


  • 0

#5 isay777

isay777
  • Topic Starter
  • JBZoo User (rus)
  • User rate: 113.4
  • posts: 1878
  • topics: 232

Posted 28 May 2015 - 23:44

ну...


Edited by isay777, 28 May 2015 - 23:45.

  • 0
ХОСТИНГ для сайтов jbzoo (все попугаи)

#6 SmetDenis

SmetDenis
  • Administrators
  • User rate: 139.4
  • posts: 16232
  • topics: 200

Posted 01 June 2015 - 14:08

По просьбам наших читателей в следующем выпуске вы увидите.

21102_cartalert.gif

b75o_200x0.png

Ваша редакция.
  • 4
JBZoo v4.0 и новый чудный мир Open Source GPL
Отключайте проверку лицензий как можно скорее!



— Есть два типа людей: Кто еще не делает бекапы и кто уже делает бекапы.


#7 Save Tibet

Save Tibet
  • JBZoo User (rus)
  • User rate: 0.1
  • posts: 510
  • topics: 75

Posted 01 June 2015 - 14:35

Отлично! Спасибо, денис!


  • 0

#8 isay777

isay777
  • Topic Starter
  • JBZoo User (rus)
  • User rate: 113.4
  • posts: 1878
  • topics: 232

Posted 01 June 2015 - 15:08

Круто! 


  • 0
ХОСТИНГ для сайтов jbzoo (все попугаи)

#9 Yastroitel

Yastroitel
  • JBZoo User (rus)
  • User rate: 0.7
  • posts: 289
  • topics: 99

Posted 10 June 2015 - 14:58

Добрый день!

А как такое реализовать на 2.1.5 ?

 

Ну то есть - я смогу сам подключить sweet alert

 

А вот где поправить такой код для кнопки добавления?

Спасибо!


  • 0

#10 SmetDenis

SmetDenis
  • Administrators
  • User rate: 139.4
  • posts: 16232
  • topics: 200

Posted 11 June 2015 - 10:59

А как такое реализовать на 2.1.5 ?


Переименуйте
в папке jbuniversal\assets\js\
jquery.jbzootools.orig.js -> jquery.jbzootools.min.js с заменой

Свой код выполнить тут
xta9_200x0.png
  • 0
JBZoo v4.0 и новый чудный мир Open Source GPL
Отключайте проверку лицензий как можно скорее!



— Есть два типа людей: Кто еще не делает бекапы и кто уже делает бекапы.






Also tagged with one or more of these keywords: 220v

Click to return to top of page in style!