15+ jQuery Popup Modal Dialog Plugins and Tutorials
jQuery Popup Modal Dialog Windows
Modal dialog windows are a great way to show quick information to your users, but to also alert them of errors, warnings, prompts for information and more. When you bring jQuery into the mix, you know you’re going to end up with a slick dialog that really makes the application or website come alive. The following is a list of 15+ jQuery Popup Modal Dialog Plugins and Tutorials.
There are a couple towards the bottom that you’ll want to pay attention to. On one the original is in Italian, but I’ve included a link to an English translation. The other is more on a backend, but I’ve included a link to the zip file for downloading the files.
Let the fun begin! If you know of any that are missing but should be included, drop a comment!
jqModal
qModal is a plugin for jQuery to help you display notices, dialogs, and modal windows in a web browser. It is flexible and tiny, akin to a “Swiss Army Knife”, and makes a great base as a general purpose windowing framework.
Object Oriented Programming with JavaScript : Timer Class
JavaScript with Oops is not much used by developers while creating application however we can make our life easy if we use JavaScript with Oops.
Let's started object oriented programming in JavaScript by taking example of a Timer class, similar to the Timer control in windows application.
Create Class
Create the class Timer. Below code shows how to declare the class
// Declaring class "Timer" var Timer = function() { // .... // Class body // .... }
Using RegEx (Regular Expressions) in JavaScript
Javascript has built-in support for regular expression in almost all browsers. This means you can use regular expression at client side too. You can use to validate the user's input data at client side itself to reduce the server side processing, however you may want to check those at server side too for security problems.
To use regular expression in javascript you can use the RegExp object
var myRegExp = new RegExp("[a-zA-z]+");
Or you can directly creates its instance by using special syntax
var myRegExp = /[a-zA-z]+/
Checking Username Availability with Mootools and Request.JSON
This tutorial will teach you how to check username availability with Mootools' Request.JSON and PHP/MySQL
In this tutorial you will learn how to use Mootools' Request.JSON function to check a username against an array or database. In this example we will be using a simple MySQL database. I will try to do as much hand holding as I can, but having a little experience with PHP and MySQL will be a plus.
Tutorial Details
- PHP Server and MySQL Database required
- Difficulty: Beginner/Intermediate
- Estimated Completion Time: 30 - 45 Minutes
Step 1 - The Setup
We are going to create a simple database and add a table. After that we will add a username into the database.
CREATE TABLE IF NOT EXISTS ajax_users ( id INT(2) NOT NULL PRIMARY KEY AUTO_INCREMENT, user_name VARCHAR(128) NOT NULL ); INSERT INTO ajax_users VALUES('NULL','matt');
jQuery Lightbox
I couldn't tell you how many lightboxes I've used over the last few month. This specific lightbox was designed as a plugin for the jQuery library. It works perfectly, and more importantly, requires no additional markup to your document. You only need to call it from your Javascript file. You'll have zero problems!
11 Classic CSS Techniques Made Simple with CSS3
CSS3? What's that?!
I'm sure you've heard of CSS in general. CSS3 isn't that much different, in terms of syntax; however, the power of CSS3 is much greater. As you'll see in these eleven techniques, you can have multiple backgrounds, dynamically resize those backgrounds, border radiuses, text shadows, and more!
Here's what the official (or at least, what I consider official) website of CSS3, css3.info, has to say about CSS3:
CSS3 is the new kid in the stylesheet family. It offers exciting new possibilities to create an impact with your designs, allows you to use more diverse style sheets for a variety of occasions and lots more.
Here are the 11 techniques that I'll be showing you how to recreate with CSS3. I'll show you how to create them using CSS2 (or JavaScript), and then with CSS3 properties. Remember - these effects will only work in modern browsers that implement these CSS3 features. Your best option is to view these with Safari 4.
- Rounded Corners
- Box Shadow
- Text Shadow
- Fancy Font
- Opacity
- RGBA
- Background Size
- Multiple Backgrounds
- Columns
- Border Image
- Animations
Subscribe via Email
Categories
- 2D Graphics (8)
- Photoshop (8)
- Miscellaneous (15)
- Internet (9)
- Using Software (6)
- Web Hosting (1)
- OS (19)
- PC (2)
- Programming (1)
- .Net (1)
- Resource (2)
- Icon (2)
- Web Design & Development (14)
- Adobe Flex (1)
- CSS (1)
- HTML (3)
- Java (1)
- Javascript (6)
- PHP (2)
- SEO (1)
Archives
Calendar
| M | T | W | T | F | S | S |
|---|---|---|---|---|---|---|
| « Feb | ||||||
| 1 | 2 | 3 | 4 | 5 | 6 | 7 |
| 8 | 9 | 10 | 11 | 12 | 13 | 14 |
| 15 | 16 | 17 | 18 | 19 | 20 | 21 |
| 22 | 23 | 24 | 25 | 26 | 27 | 28 |
| 29 | 30 | 31 | ||||
Recent Posts
- vBulletin Variables List
- Design a Transparent Website Layout in Photoshop
- 15+ jQuery Popup Modal Dialog Plugins and Tutorials
- Windows 7 Sidebar for XP/Vista
- How to turn off AutoPlay (AutoRun) in Windows XP?
- How to repair Internet Explorer 6 in Windows XP
- Flex Alert! Listen to the buttons
- Computer Image File Formats
- How Hard Drives work
- Object Oriented Programming with JavaScript : Timer Class
Recent Comments
- reverse phone lookup on Birdies A Free Twitter Icon Set
- confused on Put a background to your USB flashdrive
- reddy on Put a background to your USB flashdrive
- Aravind.N on Put a background to your USB flashdrive
- James Patrick on Put a background to your USB flashdrive
Link Exchange
Meta
Stats
- Total Stats
- 1 Author
- 59 Posts
- 14 Comments
- 44 Post Categories
- 23 Spam Blockeds
Web Directory
