1

Using Magento2 commercial theme, and this theme has Minicart closing on "hover". We want to change this to original Magento2 closing on click.

Tried everything nothing works:

<div class="block block-minicart empty"
             data-role="dropdownDialog"
             data-mage-init='{"dropdownDialog":{
                "appendTo":"[data-block=minicart]",
                "triggerTarget":".showcart",
                 "timeout": "2000",
                "closeOnMouseLeave": false,
                "closeOnEscape": false,
                "triggerClass":"active",
                "parentClass":"active",
                "buttons":[]}}'>
        <div id="minicart-content-wrapper" data-bind="scope: 'minicart_content'">
            <!-- ko template: getTemplate() --><!-- /ko -->
        </div>
6
  • Change Hover js to click Commented Jul 4, 2017 at 13:03
  • Where? i have changed minicart.phtml but no luck
    – user38833
    Commented Jul 4, 2017 at 13:05
  • can you please in question i will check Commented Jul 4, 2017 at 13:06
  • have you tried changing these values to true closeOnMouseLeave and closeOnEscape
    – Priyank
    Commented Jul 4, 2017 at 13:10
  • Yes i did but no luck
    – user38833
    Commented Jul 4, 2017 at 13:20

1 Answer 1

2

Hi I tried like that it is work.

<div class="block block-minicart empty"
             data-role="dropdownDialog"
             data-mage-init='{"dropdownDialog":{
                "appendTo":"[data-block=minicart]",
                "triggerTarget":".showcart",
                "timeout": "2000",
                "closeOnMouseLeave": false,
                "closeOnEscape": true,
                "triggerClass":"active",
                "parentClass":"active",
                "buttons":[]}}'>
20
  • set "triggerEvent":"click" Commented Jul 4, 2017 at 13:14
  • Nope not working, i have copied your code but no luck
    – user38833
    Commented Jul 4, 2017 at 13:19
  • i will check this what Magento given devdocs.magento.com/guides/v2.0/javascript-dev-guide/widgets/… Commented Jul 4, 2017 at 13:22
  • $('.container').hover(function () { check also change click Commented Jul 4, 2017 at 13:36
  • This is what i have now: <div class="block block-minicart empty" data-role="dropdownDialog" data-mage-init='{"dropdownDialog":{ "appendTo":"[data-block=minicart]", "triggerTarget":".showcart", "triggerEvent":"click", "timeout": "500", "closeOnMouseLeave": false, "closeOnEscape": false, "triggerClass":"active", "parentClass":"active", "buttons":[]}}'> where is $('.container').hover(function () {?
    – user38833
    Commented Jul 4, 2017 at 13:39

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.