wpengine

wpengine

Welcome, Guest
Username: Password: Remember me
Forgot your password? Forgot your username? Create an account
Forum
Animate It!
Questions
Animate Menu Item

TOPIC: Animate Menu Item

Animate Menu Item 9 years 2 weeks ago #134

  • Robert
  • Robert's Avatar
  • Offline
  • New Member
  • Posts: 3
  • Karma: -1
I've only been playing with your plugin a short time but it is amazing what you can do with it. I was wondering if it was possible to animate a menu item like the one on this website: resultsfoodcoaching.com/

Thank You.
The administrator has disabled public write access.

Animate Menu Item 9 years 2 weeks ago #135

  • eLEOPARD
  • eLEOPARD's Avatar
  • Offline
  • Administrator
  • Posts: 409
  • Thank you received: 54
  • Karma: -28
Dear Robert,

You can do a lot of things with Animate It!
However, I am afraid this is not one of them :)

You will have to write some additional Jquery in order to detect the scroll and add the animate in classes accordingly.
The administrator has disabled public write access.

Animate Menu Item 9 years 2 weeks ago #136

  • Robert
  • Robert's Avatar
  • Offline
  • New Member
  • Posts: 3
  • Karma: -1
I wasn't worried about the scroll, just the animation of the menu item from the right. Thank you for the additional information.
The administrator has disabled public write access.

Animate Menu Item 9 years 2 weeks ago #137

  • eLEOPARD
  • eLEOPARD's Avatar
  • Offline
  • Administrator
  • Posts: 409
  • Thank you received: 54
  • Karma: -28
Well, in that case, you can pretty much animate anything on the menu you want.

Here's an example of what I've created using the plugin as a test:
http://animateitdemo.wpdevcloud.com/top-menu-test/

And here's the code that I have used (Let me know if you need CSS style as well)
<div class="top-menu-test   animated fadeInDown delay1">
	<div class="container">
		<div class="meni-item-logo   animated fadeInLeft delay3">
			<img src="http://resultsfoodcoaching.com/wp-content/uploads/2015/03/results-logo_color.svg" />
		</div>
	    	<div class="top-menu-items">
			<span class="menu-items animated fadeInRight delay3">
				<a href="#">Home</a>
			</span>
			<span class="menu-items animated fadeInRight delay4">
				<a href="#">What We Do</a>
			</span>
			<span class="menu-items animated fadeInRight delay5">
				<a href="#">How it Works</a>
			</span>
			<span class="menu-items animated fadeInRight delay6">
				<a href="#">Testimonials</a>
			</span>
			<span class="menu-items animated fadeInRight delay7">
				<a href="#">Our Team</a>
			</span>
			<span class="menu-items animated fadeInRight delay8">
				<a href="#">Blog</a>
			</span>
			<span class="menu-items get-started animated fadeInRight delay9">
				<a href="#">Get Started</a>
			</span>
		</div>
	</div>
</div>

Last but not the least. Please don't forget to rate the Plugin :)
Last Edit: 9 years 2 weeks ago by eLEOPARD.
The administrator has disabled public write access.

Animate Menu Item 9 years 1 week ago #138

  • Robert
  • Robert's Avatar
  • Offline
  • New Member
  • Posts: 3
  • Karma: -1
Works great, thank you very much!
The administrator has disabled public write access.

Animate Menu Item 9 years 1 week ago #139

  • eLEOPARD
  • eLEOPARD's Avatar
  • Offline
  • Administrator
  • Posts: 409
  • Thank you received: 54
  • Karma: -28
Glad to help.
Last but not the least, please don't forget to rate the plugin :)
The administrator has disabled public write access.
Forum
Animate It!
Questions
Animate Menu Item
Time to create page: 0.221 seconds

Need Customization? Feel free to...

Contact Us

If you like these extensions, help us buy Yoga Mats :)