Quick View

This topic has 6 replies, 2 voices, and was last updated 11 months ago by Elise Noromit.

Viewing 7 posts - 1 through 7 (of 7 total)

Author

Posts

June 17, 2023 at 5:55 pm #475657

Participant

Hi Xtemos,

I want to know if it is possible to just have Quick View? I mean when I click on the image (all products) it only loads the quick view.

If it is not possible could please give me an additional code customization ? Thank you very much.

June 17, 2023 at 5:56 pm #475658

phumraphee

Participant

for the desktop layout only

June 17, 2023 at 6:37 pm #475662

phumraphee

Participant

I found the code on this, but it not work with my website, can you please give me the new one?

https://xtemos.com/forums/topic/quick-view-3/

June 17, 2023 at 7:15 pm #475663

phumraphee

Participant

now I can fix it with this code:

jQuery(document).ready(function() {
    jQuery(document).on('click', '.product-image-link, .product-element-bottom', function(e) {
        e.preventDefault();
        jQuery(this).closest('.product-grid-item').find('.open-quick-view').click();
    });

    jQuery(document).on('click', '.open-quick-view', function(e) {
        e.preventDefault();
    });
});

but when i click on the Quick View contents it suddenly close, Can you help me with this problem ?

June 17, 2023 at 7:51 pm #475664

phumraphee

Participant

I found that when I paste the code


jQuery(document).ready(function() {
    jQuery(document).on('click', '.product-image-link, .product-element-bottom', function(e) {
        e.preventDefault();
        jQuery(this).closest('.product-grid-item').find('.open-quick-view').click();
    });

    jQuery(document).on('click', '.open-quick-view', function(e) {
        e.preventDefault();
    });
});

In the Custom JS->Global It has some error in Console of the browser when I click the product image to open the QuickView,

jquery.min.js?ver=3.6.4:2 Uncaught RangeError: Maximum call stack size exceeded
    at String.replace (<anonymous>)
    at Function.se (jquery.min.js?ver=3.6.4:2:7120)
    at Function.<anonymous> (jquery-migrate.min.js?ver=3.4.0:2:2847)
    at e.<computed> [as find] (jquery-migrate.min.js?ver=3.4.0:2:1566)
    at HTMLBodyElement.handlers (jquery.min.js?ver=3.6.4:2:43646)
    at HTMLBodyElement.dispatch (jquery.min.js?ver=3.6.4:2:42871)
    at y.handle (jquery.min.js?ver=3.6.4:2:41168)
    at Object.trigger (jquery.min.js?ver=3.6.4:2:71790)
    at HTMLAnchorElement.<anonymous> (jquery.min.js?ver=3.6.4:2:72385)
    at Function.each (jquery.min.js?ver=3.6.4:2:3003)
se @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
handlers @ jquery.min.js?ver=3.6.4:2
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery-migrate.min.js?ver=3.4.0:2
e.<computed> @ jquery-migrate.min.js?ver=3.4.0:2
(anonymous) @ VM1262:5
dispatch @ jquery.min.js?ver=3.6.4:2
y.handle @ jquery.min.js?ver=3.6.4:2
trigger @ jquery.min.js?ver=3.6.4:2
(anonymous) @ jquery.min.js?ver=3.6.4:2
each @ jquery.min.js?ver=3.6.4:2

For now, I still use the code above, You can go to my website and get some Inspect, Thank you!

June 19, 2023 at 11:24 am #475817

phumraphee

Participant

now, I can fix the error in console with this code and it OK for me.

jQuery(document).on('click', '.product-image-link', function(e) {
    e.preventDefault();
    jQuery(this).closest('.product-grid-item').find('.open-quick-view').click();
});

but the problem is when i click on the Quick View contents it suddenly close, Can you help me with this problem ?

You can see the Private Content for the Video.

June 20, 2023 at 12:38 am #475946

Elise Noromit

Member

Hello,

Please replace your code with this one:

 jQuery(document).on('click', '.product-image-link', function(e) {
        e.preventDefault();
        jQuery(this).parents('.product-grid-item').find('.open-quick-view').trigger('click);
    });

If you have any questions please feel free to contact us.

Best Regards

Author

Posts

Viewing 7 posts - 1 through 7 (of 7 total)

Quick View

Create your WordPress website.

Sign in