In today’s tutorial we are going to see how we can create a “real” ebook by using the jQuery plugin turn.js. Using this jQuery plugin you can create a real looking turn of pages to create a magazine looking web page.
View the demo to see what you can create with Turn.js.
Turn.js is a plugin for jQuery that adds a beautiful transition similar to real pages in a book or magazine. It works in all modern browsers including touch devices.
Read More →
Displaying your social media account on your website gives them great exposure to your accounts and allows your readers to easily follow you on the different social networks.
There is an awesome jQuery plugin that allows you to create a nice pop-up with your contact information.
Hovercard is a free light weight jQuery plugin that enables you to display related information with the hovered label, link, or any html element of your choice.
Read More →
In this tutorial you will learn how you don’t need to use the old powerpoint presentation software now we have Impress.js.
Impress.js is a presentation framework which uses all the new features of CSS3 transforms and CSS transitions to create unique presentations.
Read More →
In today’s tutorial we are going to use a nice jQuery plugin which will change the style of your select boxes by converting them to use divs and list items.
The reason it will convert the select box to a div and list items is because now it is easier to style in what ever way you want. With normal select boxes you can style the top selected option but you can’t easily style the dropdown options of the select box. When these are list items you can apply a CSS class to the selected item and change the style.
Read More →
In today’s tutorial we are going to work with a Javascript library which allows you to easily deal with money in any web application.
This JavaScript file will allow you to create an online application to easily convert from one currency to another using only one function.
In today’s tutorial we are going to learn how to create a small web application that will display an RSS feed on a web page using jQuery and PHP.
To do this we are going to use jQuery AJAX functionality to easily get the data from a PHP proxy and display it on the web page.
In this tutorial we are going to use the jQuery load method which is a quick way of using the AJAX Get function to get the contents of a file.
Read More →
You will always come across websites that add some code in to try and stop you from doing things on there website, but the things they are trying to stop you doing are standard activities you would normally expect your be able to do.
Such as highlighting text on the page, right clicking to copy, right clicking to go to search or opening an image in a new tab. I’ve seen some websites that put in bits of Javascript to stop you doing these tasks. I’m not sure why they would waste time trying to stop people doing this as it’s easy to get around by turning Javascript off, the only thing it does is annoy it’s visitors. Then I thought about all the other annoying stuff you see with Javascript such as pop up boxes.
Read More →
jQuery allows you change the way you interact with your website with very little code. jQuery has an animate function which allows you to animate anything that jQuery does, including scrolling.
Animate scrolling creates a better effect to the visitor than to just job to a place on the page.
There are many websites that will use internal links to jump to different parts of the page this is done by using a # and then the element id in the anchor tag.
Read More →
In the tutorial today you will learn how you can use jQuery to get the distance of the mouse from a certain element on the page. This bit of code can be useful on a small web app which has a lot of user interaction and you want an event to run when the user mouse is in a certain distance from an element.
There is a demo page for this code, which has a label to show the distance in pixels and an element which we will take the center position for.
Read More →
Creating a good user experience on your website is very important to keep people on the page. The best way to create a good user experience is to make it easy for people to use, if your site is difficult to use it annoys people and they will move on.
For websites that have a lot of information on the page you will scroll far down the page to consume the information. Websites like Google+ who have infinite page scroll can be very annoying if you want to go back to the top of the page to click on a link there. You can either refresh the page or move the scroll bar all the way back to the top.
Websites with initiate scroll need something to make it easy to return to the top. This is done with a button which will scroll them back to the top.
In this tutorial you will learn how you can create an animated scroll to top button with jQuery.