• 0

Remove animation from iboxes in footer


Question

Posted · Report post

Hi,

The problem is that the animation to display the ibox images is not activating because the iboxes are in the footer. Does anyone have some code to remove the animation so that they don't have to be triggered or even a way to trigger them sooner. Here is my project: http://staging.garympomerantz.com/ (*note it does sometimes seem to work but not consistently).

 

Thanks!

 

Share this post


Link to post
Share on other sites

12 answers to this question

  • 0

Posted · Report post

Use this to remove the animations from iBox completely. Paste into your custom scripts area. I personally have always thought they were janky so I've removed them from day one.

 

<script>
jQuery(document).ready(function(){
    jQuery('.section-ibox .ibox-media span').removeClass('pl-animation pl-appear animation-loaded');
});
</script>
1 person likes this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi,

 

The animation of your iBoxes works just fine for me, I refreshed your website about 20 times and each time it worked without any issue.

 

However, your suggestion is a good idea, so I have reported this on our tracker for you. In the meantime, what I would suggest is that you replace the iBoxes and just use HTML instead.

I have created an article which shows you how to add your social media networks to a text, see here - http://docs.pagelines.com/tutorials/creating-a-branding-area

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks for all help. Looks like it worked. Also, It would be awesome if their where check boxes to turn off the title and text. :-P Thanks Again!

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Opps! The code isn't working. I'm getting a parse error. @beardedavenger Did I mess up your code? I'm not sure why it's not working.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

A Parse error, where are you getting the error, can you provide a screenshot please.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Danny sorry the parse error was my mistake. However the script is not working. Do you see the problem? Thanks

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Did you add the script as Nick pasted or did you wrap <script></script> around it ?

Like so:

 

<script>jQuery(document).ready(function(){
    jQuery('.section-ibox .ibox-media span').removeClass('pl-animation pl-appear animation-loaded');
});</script>

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I did not put <script></script> around it. Shoud I?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Yes, like the example I gave above.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Just re-tested this, and works. It removes the classes that DMS uses to animate.

 

However, we must do a bit more work and remove the transition property off of the icons so they dont scale in on load. To do this, add this to Custom CSS, in addition to the script above.

.ibox .ibox-media .ibox-icon-border.media-type-icon {.transition(none);}

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Woot! Thank you so much! 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

:)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now