Перейти к содержимому


Фотография
- - - - -

Красивые jQuery кнопки в корзину

рецепт jquery jquery-кнопоки кнопки

Сообщений в теме: 20

#1 isay777

isay777

Отправлено 25 October 2013 - 20:04

*
Популярное сообщение!

И так будем подключать красивые кнопки отсюда 
Демо http://tympanus.net/...iveLinkEffects/
Сайт http://tympanus.net/...e-link-effects/
CreativeLinkEffects1.png
 
 
И так скачиваем архив с кодом и css. Распаковываем, архив и подключаем css и js в наш шаблон.
 
Идем по адресу media/zoo/applications/jbuniversal/elements/jbpriceadvance/tmpl/_buttons.php  Тут есть два варианта: легкий и сложный, я пошел по легкому и просто добавил необходимые классы и элементы, чтоб не переписывать уже готовое css, но можно заморочиться и переписать все, что касается nav и поменять его на div class="jbprice-buttons" ,но я не морочился. 
Теперь нам надо удалить классы для ссылок jbzoo-button green, чтоб они нам не мешались, далее добавляем теги section и nav, при этом nav с выбранным стилем из демки. Добавляем span внутрь ссылки. 
И получаем примерно такой код 

<div class="jbprice-buttons">
    <section><nav class="cl-effect-20">
        <?php if ($mode == 'normal') : ?>
        
            <a rel="nofollow" href="#add-to-cart" class="jsAddToCart"
               title="<?php echo JText::_('JBZOO_JBPRICE_ADD_TO_CART'); ?>"><span data-hover="<?php echo JText::_('JBZOO_JBPRICE_ADD_TO_CART'); ?>"><?php echo JText::_('JBZOO_JBPRICE_ADD_TO_CART'); ?></span></a>

        <?php elseif ($mode == 'popup') : ?>
            <?php $this->app->jbassets->fancybox();?>
            <a rel="nofollow" href="#add-to-cart-modal" class="jsAddToCartModal"
               title="<?php echo JText::_('JBZOO_JBPRICE_ADD_TO_CART_MODAL'); ?>"><?php echo JText::_('JBZOO_JBPRICE_ADD_TO_CART'); ?></a>

        <?php elseif ($mode == 'oneclick') : ?>
            <a rel="nofollow" href="#add-to-cart-goto" class="jsAddToCartGoto"
               title="<?php echo JText::_('JBZOO_JBPRICE_ADD_TO_CART_GOTO'); ?>"><?php echo JText::_('JBZOO_JBPRICE_ADD_TO_CART_GOTO'); ?></a>

        <?php endif; ?>

        <a rel="nofollow" href="#remove-from-cart" class="jsRemoveFromCart remove-button"
           title="<?php echo JText::_('JBZOO_JBPRICE_REMOVE_FROM_CART'); ?>"><span data-hover="<?php echo JText::_('JBZOO_JBPRICE_REMOVE_FROM_CART'); ?>"><?php echo JText::_('JBZOO_JBPRICE_REMOVE_FROM_CART'); ?></span></a>

   </nav></section> </div>

 Я не использовал модальное окно на этом проекте, по-этому его не трогал почти. ВНИМАНИЕ очень важно оставить класс remove-button, для ухода в хайден. 
 
Более подробно в статье тут 


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

#2 ripcord

ripcord

Отправлено 28 October 2013 - 18:55

Сурово выглядит (-;

Стояла цель изменить дефолтные кнопки из карточки айтема?


  • 0
Абгемахт, славяне!

#3 isay777

isay777

Отправлено 29 October 2013 - 06:15

Цель была побаловаться  ;D

Но на самом деле, да смотрел на кнопки какие можно сделать, пробовал варианты. 


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

#4 B_A_H_O

B_A_H_O

Отправлено 30 October 2013 - 14:56

ух тыы  ... там есть чем побаловаться )


  • 0

#5 Sliapy

Sliapy

Отправлено 30 October 2013 - 20:54

Перенес сообщения в более подходящую тему.


  • 0
[color=#aa0000]Не забывайте нажимать кнопку "Вопрос Решён" под сообщением, которое решило Вашу проблему.[/color]

#6 gukaleksey

gukaleksey

Отправлено 20 January 2014 - 06:36

Более подробно где можно посмотреть? По ссылке пусто.


Сообщение отредактировал gukaleksey: 20 January 2014 - 06:37

  • 0

#7 isay777

isay777

Отправлено 20 January 2014 - 06:43

Ох... Вечером поправлю ссылку. подождете  :)


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

#8 gukaleksey

gukaleksey

Отправлено 20 January 2014 - 09:11

Ох... Вечером поправлю ссылку. подождете  :)

Да, подождём) Заранее спасибо!


  • 0

#9 Den

Den

Отправлено 11 March 2014 - 20:37

Ссылка не работает) а тема актуальна).

Поделитесь подробной инструкцией. спасибо.


  • 0

#10 Cheren-dow

Cheren-dow

Отправлено 12 March 2014 - 07:14

Ссылка не работает)

Какая  ссылка у вас не работает? Все рабочие 


  • 0
Изображение
 





Темы с аналогичным тегами рецепт, jquery, jquery-кнопоки, кнопки

Click to return to top of page in style!