 |
|
| |
|
| |
|
| |
JQuery
|
| |
|
| |
| Jquery CSS Style Switcher
|
| |
|
|
Jamal Ahmad |
|
|
0 Comments |
|
Tags:
jquery, css, switcher |
| |
|
Style Sheet switchers (or "colour theme choosers") are not really that new. Apart from that fact, they still are pretty fun to use and cool to see. I was wondering how jQuery could help me achieve this technique. While searching, I came across several solutions. There is a problem when using these techniques, which I will explain later. I created a little work-around to create a better jQuery stylesheet switcher. We'll simply change some colours for the user. Normal way First, I'll show how jQuery users normally would change their CSS file HTML This is the trimmed down version of the HTML file. As you can see, there is one style.css placed in the head and there are three links t |
|
|
|
|
|
|
| |
| jquery dimming and covering background contents
|
| |
|
|
Jamal Ahmad |
|
|
0 Comments |
|
Tags:
jquery contents |
| |
|
This is a quick and easy approach that tackles a pretty common technique. By the end of this tutorial you will be able to add pop up message boxes complete with dimmed background to your existing site. Feel free to take a look at the demo to scope out exactly what we'll be creating here today. 
The Concept Here's the gist: When a link is clicked a div that covers the entire page becomes visible and lays on top of the content. On top of that we have our message box which hides everything again when it gets closed. There are a number of different customizations we can make to this process, but it's important to have the overall picture before tweaking too much. Step 1 – The HTML <body> |
|
|
|
|
|
|
| |
| Jquery Time Picker with Slider
|
| |
|
|
Jamal Ahmad |
|
|
1 Comments |
|
Tags:
jquery time picker, jquery slider |
| |
|
jTimepicker is a jQuery plugin for set hours, minutes and seconds individually with jQuery UI Slider. 
To use the jTimepicker plugin, include the jQuery library, the jTimepicker source file, the jTimepicker core stylesheet file and jQuery UI files inside the <head> tag of your HTML document: <link rel="stylesheet" type="text/css" href="css/ui/base/ui.core.css" />
<link rel="stylesheet" type="text/css" href="css/ui/base/ui.theme.css" />
<link rel="stylesheet" type="text/css" href="css/ui/base/ui.slider.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.timepicker.css" />
<script type="text/javascript" src="lib/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="lib/ui.core |
|
|
|
|
|
|
| |
| jQuery Plugin Interactive Feedback Form
|
| |
|
|
Jamal Ahmad |
|
|
1 Comments |
|
Tags:
jquery plugin |
| |
|
Contactable is a jQuery plugin designed to make contact/feedback forms simpler and more accessible. This plugin will enable you to create a contact form on any page of a site with minimal effort. If you have ever seen the feedback forms provided by kamypyle you will be familiar with the technique they use, however contactable makes this process even simpler by overlaying the content onto your page quickly and easily with a slide effect and inline validation. 
Usage Contactable takes care of a lot of issues for you, however the plugin does have a dependency on jQuerys validate plugin, which is included in the download. To start simply create a div with an ID: <div id="contact">
</div> You will need to call in the jquery |
|
|
|
|
|
|
| |
| Jquery Forms Creating a Facebook like Registration Form
|
| |
|
|
Jamal Ahmad |
|
|
0 Comments |
|
Tags:
jquery forms |
| |
|
Introduction Facebook is a showcase of great UI design. And as it has become a major part of our lives, it has also raised the bar for web development, pushing developers to meet higher expectations. This however has a good side – it challenges web developers and designers to better themselves and constantly improve their work. In this tutorial, we are going to learn from the best, and create a facebook-like Signup Form. So go ahead and download the demo files to start learning! 
The XHTML We start off by laying down the XHTML backbone, as seen in index.php in the demo files: & |
|
|
|
|
|
|
| |
|
|
| |
|
| |
1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 |
|
| |
|
|
|
|
|
|
|
| |
|
| |
|
| |
Blog
Community |
| |
|
| |
|
| |
|
| |
|
| |
|
| |
Popular Posts |
| |
|
| |
|
| |
|
| |
|
| |
ExploreMyBlog Poll |
| |
|
| |
|
| |
|
| |
Blog Categories |
| |
|
| |
|
| |
|
| |
|
| |
|
|
|
|
![[ Stumble Upon ]](../assets/images/stubmleupon_bookmarking_icon.gif){kind=icon}
![[ Facebook ]](../assets/images/facebook_bookmarking_icon.gif){kind=icon}
![[ del.icio.us ]](../assets/images/delicious_bookmarking_icon.gif){kind=icon}
![[ furl ]](../assets/images/furl_bookmarking_icon.gif){kind=icon}
![[Sphinn]](../assets/images/sphinn_bookmarking_icon.gif){kind=icon}
![[ Digg ]](../assets/images/digg_bookmarking_icon.gif){kind=icon}
![[ Twitter ]](../assets/images/twitter_bookmarking_icon.gif){kind=icon}
![[ Technorati ]](../assets/images/technorati_bookmarking_icon.gif){kind=icon}
![[ Reddit ]](../assets/images/reddit_bookmarking_icon.gif){kind=icon}
![[ Subscribe To RSS Feeds ]](../assets/images/rss_feeds.gif){kind=small}
