CODEWITHSUNDEEP
jqueryjquery-ui
Toma Tomov
Toma Tomov

Reputation: 1704

Shake effect doesn't work

Can you help with understanding why the shake effect doesn't work in my case? Code:

$('.vote').on('click', function (e) {
        e.preventDefault();
        $("body, html").animate({
            scrollTop: $( $(this).attr('href') ).offset().top
        },{
            duration: 600,
            complete: $('#shake').effect('shake')
        });
    });

I tried also to put the effect after the preventDefault but again without success. If i call it outside of the on click event it works properly. Thank you in advance!

EDIT: Html part:

<div class="col-xs-6 col-sm-6">
                                <span class="upper">
                                    <a href="#force-reg"><span style="cursor:pointer;font-size: 40px;color: deepskyblue" class="unsigned glyphicon glyphicon-thumbs-up"></span></a>
                                </span>
                                    <span style="font-size: 40px; color: grey" class="thumb-post-up_<?= $post->id ?>"><?= $vote_up ?></span>
                                </div>
                                <div class="col-xs-6 col-sm-6">
                                <span class="upper">
                                    <a href="#force-reg"><span style="cursor:pointer;font-size: 40px;color: grey" class="unsigned glyphicon glyphicon-thumbs-down"></span></a>
                                </span>
                                    <span style="font-size: 40px; color: grey" class="thumb-post-down_<?= $post->id ?>"><?= $vote_down ?></span>
                                </div>

#shake div:

<?php if(!(\Yii::$app->user->isGuest)) : ?>
            <div class="col-md-6 text-right custom-title">
                <span style="cursor:pointer;margin-right: 12px;" id="add-comment" class="button button-accent">Добави коментар</span>
            </div>
        <?php else : ?>
            <div id="shake" class="col-md-6 col-sm-6 col-xs-12 text-right custom-title">
                <a href="http://find-doctor.webbuild.com/user/register"><span style="cursor:pointer;margin-right: 12px;"class="button button-accent">Само регистрираните потребители могат да коментират и гласуват!</span></a>
            </div>
        <?php endif; ?>

Upvotes: 0

Views: 421

Answers (1)

Govind Samrow
Govind Samrow

Reputation: 10189

Problem with this object use,In your example you're trying to get href of clicked link but this refer to Current function animate. I've create an example from your code try this:

$('.vote').on('click', function(e) {
  e.preventDefault();
  $("body, html").animate({
    scrollTop: $('.vote').offset().top
  }, {
    duration: 600,
    complete: $('#shake').effect('shake')
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

            <div id="shake" class="col-md-6 col-sm-6 col-xs-12 text-right custom-title">
                <a href="http://find-doctor.webbuild.com/user/register"><span style="cursor:pointer;margin-right: 12px;"class="button button-accent">Само регистрираните потребители могат да коментират и гласуват!</span></a>
            </div>
            
            <a href="#" class="vote">vote </a>

Upvotes: 1

Related Questions