Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.12.2015, 00:01
Аспирант
Отправить личное сообщение для майрбек95 Посмотреть профиль Найти все сообщения от майрбек95
 
Регистрация: 31.03.2015
Сообщений: 44

Небольшой js помогите
Доброго времени всем суток! Очень нужна ваша помощь, помогите пожалуйста....

Делаю полет изображений в корзину по нажатии кнопки, код:

<script type="text/javascript">
 var nn = $('класс').html();
 $("класс").click(function(){ 
 $("класс") 
 .clone() 
 .css({'position' : 'absolute', 'z-index' : '9999'}) 
 .animate({opacity: 0.4, 
 marginLeft: 700, 
 marginTop: -600, 
 width: 80, 
 height: 80}, 1000, function() { 
 $(this).remove(); 
 }); 
 }); 
 }); 

</script>


А вот код кнопки и изображение которое должно полететь:

<img src="$THUMB$" class="gphoto" id="$BLOCK_PREF$-gphoto-$ID$" alt="$NAME$">
<div id="top_sold-411-wish" class="wish wadd" onclick="wishlist(this);" title="Добавить в список желаний"></div>


Его класс "wish wadd" меняется при нажатии на "wish wdel" и обратно при повторном. А id "top_sold-411-wish" 411 - это уникальный ID у каждой кнопки он разный.

Могите изменить код jquery чтобы работала только с классом, у меня лично не получилось зарабатывала только одна самая первая кнопка а мне нужно чтобы работала каждая и каждая отправляла в полет именно свою картинку, и хочется чтобы в реальном времени если "wish wadd" изображение летело при нажатии (при клике класс меняется) а если "wish wdel" ничего не происходило.

Буду вам очень благодарен, помогите.

Если нужно вот полный код материала

<div class="list-item" id="top_sold-item-359"><span class="gnew" data-date="26.10.2015">NEW</span>
<span class="gsale">SALE</span>
<a href="/shop/359/desc/torgovaja-stojka" class="gimg" title="Перейти на страницу товара">
 <img src="/_sh/3/359m.jpg" class="gphoto" id="top_sold-gphoto-359" alt="Торговая стойка сетчатая ПР41">
</a>
<div class="gname">
 <a href="/shop/359/desc/torgovaja-stojka">Торговая стойка сетчатая ПР41</a> 
</div>
<div class="gbuttons">
 <a href="javascript:void(0)" class="bt bt-2" onclick="javascript:add2Basket('359','top_sold');" title="Добавить в корзину"><i class="fa fa-shopping-cart"></i></a>
 <div id="top_sold-359-wish" class="wish wdel" onclick="wishlist(this);" title="Удалить из списка желаний"></div>
</div>
<div class="gprice uprice"><span class="top_sold-good-359-price">1850 </span><i class="fa fa-rub"></i></div>
<div class="actions">
 <p>Арт. 3055</p>
 
 <li>шесть корзин 0,4х 0,3 м</li><li>габариты 1,89 х 0,6 м</li>
</div>

<script type="text/javascript">
 var kaa = "top_sold-359-wish";
 alert(kaa.split('-')[0]);
 var nn = $('.number_rov').html();
 $("#top_sold-359-wish").click(function(){ 
 $("#top_sold-gphoto-359") 
 .clone() 
 .css({'position' : 'absolute', 'z-index' : '9999'}) 
 .animate({opacity: 0.4, 
 marginLeft: 700, 
 marginTop: -600, 
 width: 80, 
 height: 80}, 1000, function() { 
 $(this).remove(); 
 }); 
 }); 
 }); 

</script></div>


Мне нужно работать только исключительно классами
Ответить с цитированием
  #2 (permalink)  
Старый 18.12.2015, 00:08
Аватар для abrahadabra
Новичок на форуме
Отправить личное сообщение для abrahadabra Посмотреть профиль Найти все сообщения от abrahadabra
 
Регистрация: 17.12.2015
Сообщений: 3

$("класс").click(function(){
 $(this).clone() … // и далее всё как было
Ответить с цитированием
  #3 (permalink)  
Старый 18.12.2015, 00:14
Аспирант
Отправить личное сообщение для майрбек95 Посмотреть профиль Найти все сообщения от майрбек95
 
Регистрация: 31.03.2015
Сообщений: 44

А можно чуть подробнее, не очень силен в js
Ответить с цитированием
  #4 (permalink)  
Старый 18.12.2015, 00:19
Аспирант
Отправить личное сообщение для майрбек95 Посмотреть профиль Найти все сообщения от майрбек95
 
Регистрация: 31.03.2015
Сообщений: 44

Понял что вы имеете ввиду, но

Цитата:
не получилось зарабатывала только одна самая первая кнопка а мне нужно чтобы работала каждая и каждая отправляла в полет именно свою картинку, и хочется чтобы в реальном времени если "wish wadd" изображение летело при нажатии (при клике класс меняется) а если "wish wdel" ничего не происходило.
Ответить с цитированием
  #5 (permalink)  
Старый 18.12.2015, 00:27
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

майрбек95,
$(function() {
    $(".wadd").click(function() {
        var parent = $(this).parents(".list-item");
        $(".gphoto", parent).clone().css({
            "position": "absolute",
            "z-index": "9999"
        }).appendTo("body").animate({
            opacity: .4,
            marginLeft: 700,
            marginTop: -600,
            width: 80,
            height: 80
        }, 1000, function() {
            $(this).remove()
        })
    })
});
Ответить с цитированием
  #6 (permalink)  
Старый 18.12.2015, 08:36
Аспирант
Отправить личное сообщение для майрбек95 Посмотреть профиль Найти все сообщения от майрбек95
 
Регистрация: 31.03.2015
Сообщений: 44

Спасибо огромное это именно то, что мне нужно. А нельзя ли чтобы полет был от кнопки? т.е. от места где находится нажимаемая кнопка?
Ответить с цитированием
  #7 (permalink)  
Старый 18.12.2015, 08:57
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Сообщение от майрбек95
полет был от кнопки
$(function() {
    $(".wadd").click(function(event) {
        event.preventDefault();
        var parent = $(this).parents(".list-item"),
            pos = $(this).offset();
        $(".gphoto", parent).clone().css({
            "position": "absolute",
            "z-index": "9999",
            "left": pos.left,
            "top": pos.top
        }).appendTo("body").animate({
            opacity: .4,
            marginLeft: 700,
            marginTop: -600,
            width: 80,
            height: 80
        }, 1E3, function() {
            $(this).remove()
        })
    })
});
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите расшифровать JS pavdin Общие вопросы Javascript 24 01.04.2017 20:37
Помогите исправить ошибку. node js (tradebot) SuperGangster Node.JS 3 22.07.2015 22:02
Помогите к js коду, написать html код Modrih Элементы интерфейса 8 16.06.2015 18:08
Помогите разобраться ... Я новенький в JS ... bogong Общие вопросы Javascript 23 27.12.2011 19:20
помогите со js скриптом поиска по текстовой базе MorganStels Ваши сайты и скрипты 4 15.06.2010 10:03