🔥یلدا با راکت با (( ۷۰ درصد‌ )) تخفیف! یلدا طولانی است، اما این تخفیف نه.

مشاهده دوره‌ها

ثانیه

دقیقه

ساعت

روز

ورود عضویت

Alireza Kafi

7 سال پیش توسط Alireza Kafi مطرح شد

2 پاسخ

ایجاد استایل در هنگام hover

سلام
دوستان من یه همچین owl carousel دارم که توش 24 تا محصول قرار داره ، میخوام با jquery کد بزنم که وقتی رو title هر کدوم رفتم عکس خود اون محصول bg ش عوض شه ولی مشکلم اینه که کل محصولات رنگش bg عوض میشه.

<ul class="products products-slider owl-carousel ...etc">
    <div class="owl-stage-outer owl-height" style="height: 421px;">
        <div class="owl-stage">
            <div class="owl-item" style="width: 310.8px;">
                <li class="show-links-outimage post-10080 ...etc">
                    <div class="product-inner">
                        <div class="product-image">

                        </div>
                        <a href="">
                            <h3 class="woocommerce-loop-product__title">اسید سولفوریک</h3>
                        </a>
                    </div>
                </li>
                <li class=""></li>
                <li class=""></li>
                <li class=""></li>
                <li class=""></li>
                ...
            </div>
        </div>
    </div>
</ul>

کد jquery هم اینه:

$('.product-inner').find(".woocommerce-loop-product__title").hover(function() {
        $('.product-inner').find(".product-image").css("background-color", "#093f89");
    }, function() {
        // on mouseout, reset the background colour
        $('.product-inner').find(".product-image").css('background-color', '');
    });

میخوام هر وقت اون h3 عه که title عه روش hover شد کلاس.product-image رنگش زمینه ش عوض شه

ثبت پرسش جدید

Alireza Kafi

@alirezakafi 7 سال پیش مطرح شد

مشکل حل شد . ممنون.
اینم کدش:

$('.product-inner').find(".woocommerce-loop-product__title").hover(function() {
    var unique_class = '.' + $(this).parent().closest('li').attr('class').split(' ')[1];
    $(unique_class).find(".product-image").css("background-color", "#093f89");
}, function() {
    // on mouseout, reset the background colour
    $('.product-inner').find(".product-image").css('background-color', '');
});

ارسال پاسخ

علی سرلک

@aliesarlak 7 سال پیش مطرح شد

علی رضا عزیز لطفا تصویری از موردی که میفرمایین ارائه کنین که بهتر بشه بهتون کمک کرد

ارسال پاسخ

Alireza Kafi

@alirezakafi 7 سال پیش مطرح شد

مشکل حل شد . ممنون.
اینم کدش:

$('.product-inner').find(".woocommerce-loop-product__title").hover(function() {
    var unique_class = '.' + $(this).parent().closest('li').attr('class').split(' ')[1];
    $(unique_class).find(".product-image").css("background-color", "#093f89");
}, function() {
    // on mouseout, reset the background colour
    $('.product-inner').find(".product-image").css('background-color', '');
});

ارسال پاسخ

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام

ایجاد استایل در هنگام hover

گزینش سوالات

گفت و گو های مرتبط

دسته ‌بندی سوالات

تگ‌های محبوب

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید