JQuery UI के साथ show() पर एनिमेशन का उपयोग करते समय, .ui-effects-wrapper वर्ग जोड़ा गया है। .ui-effects-wrapper वर्ग को कैसे हटाएं?

$('.desc').eq(0).show();
$('.tab-child').hover(function(){
  $('.desc').hide();
  $('.desc').eq($(this).index()).show("shake", 4000);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
<div class="tab">
    <div class="tab-child">One</div>
    <div class="tab-child">Two</div>
    <div class="tab-child">Three</div>
    <div class="tab-child">Four</div>
</div>
<div class="content">
    <div class="desc" style="display: none;"> ONE: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ornare neque at velit fermentum, vulputate tempus
        lorem vulputate. Quisque eu ipsum venenatis, posuere tortor ut, maximus neque. Aenean tempor justo leo. Vestibulum
        auctor, urna ut scelerisque rutrum, sem arcu egestas ipsum, ut maximus magna turpis ut nunc. Nulla rutrum velit
        nisi, ac feugiat est commodo eu. Maecenas eget velit urna. Mauris posuere ex quis dictum commodo. Donec porta
        lobortis turpis, eget iaculis diam tincidunt at.
    </div>
    <div class="desc" style="display: none;"> TWO: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ornare neque at velit fermentum, vulputate tempus
        lorem vulputate. Quisque eu ipsum venenatis, posuere tortor ut, maximus neque. Aenean tempor justo leo. Vestibulum
        auctor, urna ut scelerisque rutrum, sem arcu egestas ipsum, ut maximus magna turpis ut nunc. Nulla rutrum velit
        nisi, ac feugiat est commodo eu. Maecenas eget velit urna. Mauris posuere ex quis dictum commodo. Donec porta
        lobortis turpis, eget iaculis diam tincidunt at.
    </div>
    <div class="desc" style="display: none;"> TREE: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ornare neque at velit fermentum, vulputate tempus
        lorem vulputate. Quisque eu ipsum venenatis, posuere tortor ut, maximus neque. Aenean tempor justo leo. Vestibulum
        auctor, urna ut scelerisque rutrum, sem arcu egestas ipsum, ut maximus magna turpis ut nunc. Nulla rutrum velit
        nisi, ac feugiat est commodo eu. Maecenas eget velit urna. Mauris posuere ex quis dictum commodo. Donec porta
        lobortis turpis, eget iaculis diam tincidunt at.
    </div>
    <div class="desc" style="display: none;"> FOUR: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ornare neque at velit fermentum, vulputate tempus
        lorem vulputate. Quisque eu ipsum venenatis, posuere tortor ut, maximus neque. Aenean tempor justo leo. Vestibulum
        auctor, urna ut scelerisque rutrum, sem arcu egestas ipsum, ut maximus magna turpis ut nunc. Nulla rutrum velit
        nisi, ac feugiat est commodo eu. Maecenas eget velit urna. Mauris posuere ex quis dictum commodo. Donec porta
        lobortis turpis, eget iaculis diam tincidunt at.
    </div>
</div>
2
Kiran Shahi 28 मार्च 2018, 11:23

2 जवाब

सबसे बढ़िया उत्तर

उस रैपर के बच्चों को ढूंढें और रैपर को हटा दें।

$(".ui-effects-wrapper").children().unwrap();
0
Kiran Shahi 28 मार्च 2018, 08:32

यदि यह वह तत्व है जिसे आप $('.desc') से वैपर वर्ग को हटाना चाहते हैं, तो निम्नलिखित जोड़ें।

$('.desc').eq(0).show();

$('.tab-child').hover(function(){
  $('.desc').hide();
  $('.desc').eq($(this).index()).show("shake", 4000);
  $('.desc').removeClass('ui-effects-wrapper');
});

मैंने ऊपर आपका कोड चलाया और मैं उस वर्ग को कहीं भी नहीं देख रहा हूं, जो कि प्रभाव के लिए जोड़ा गया है, प्रभाव के बाद पहले से ही चला जाता है।

कम से कम, आप उस removeClass() का उपयोग किसी भी तत्व पर और आप जिस भी वर्ग के लिए कर सकते हैं हटाना चाह रहे हैं।

1
Kiran Shahi 28 मार्च 2018, 08:59