jQuery show() and hide() are the most common used effect. show() – Display the matched elements. hide() – Hide the matched elements. Both methods are support duration as parameter : slow, fast, or exact milliseconds. If this parameter is omitted, the default 400 milliseconds is apply. Try it yourself <html> <head> <script type="text/javascript" src="jquery-1.4.2.min.js"></script> <style …
jQuery comes with three handy methods to create the sliding effect easily. slideUp() – Hide the matched elements with slide up effect. slideDown() – Display the matched elements with slide down effect. slideToggle() – If the matched element is displayed, it will hide with a slide up effect; if hidden, it will display with a …
jQuery comes with three handy methods to create the fading effect easily. fadeIn() – Display the matched elements with fade in effect. fadeOut() – Hide the matched elements with fade out / transparent effect. fadeTo() – Fading the matched elements to certain opacity. Above three methods are support duration as parameter : slow, fast, or …
jQuery comes with a hover() mouse event to allow attach two event handlers to the matched elements, executed when the mouse enters and leaves the matched elements. $("#id").hover(A, B); A – function to call when the mouse enters the matched element. B – function to call when the mouse leaves the matched element. This is …
Here’s a simple idea to create a tooltips message with jQuery. Idea… Identify the “target” that need to show the tooltips message. Create a tooltips message and CSS style for it. Three functions, – showTooltips, hideTooltips, changeTooltipsPosition. While mouseenter the “target“, use showTooltips to show the tooltips message and initial the position with changeTooltipsPosition. While …
Mashable, best known as social media resources website, created an awesome floating effect while user scrolling the page. Here’s a simple idea to clone this floating effect with jQuery. Idea… Create a floating box. Initial the floating box location, put it beside the body content. While user scrolling the page, keep checking the scroll bar …
JQuery is really a powerful and handy JavaScript library. The page or content loading effect is very easy to implement in jQuery. Here’s a example to make your web page content display a fade in page loading effect. It will make your reader a shock impression. 🙂 The idea is simple ~ 1. Create a …