Archive: javascript
-
Aug 29, 2011
Comments OffUsing Javascript to POST Data Between Pages
The following is a simple example of how to submit data from one HTML page to another using the POST method from Javascript. Normally, if data needs to be sent from one HTML page to another, it is done by appending the information to the query parameter of the the URL in the familiar “name=valueâ€...
-
Aug 29, 2011
Comments OffCheck or Uncheck All in a Group of Checkbox in JavaScript
JavaScript code to be kept before head tag. 1 2 3 4 5 6 7 8 9 10 11 12 13 <SCRIPT LANGUAGE="JavaScript"> function CheckAll(chk) { for (i = 0; i < chk.length; i++) chk[i].checked = true ; } function UnCheckAll(chk) { for (i = 0; i < chk.length; i++) chk[i].checked = false ; }...
-
Aug 29, 2011
Comments OffHow to do Date format validation in PHP
Today Sushil asked me how can we validate the date which is entered from textbox in “YYYY-MM-DD” format. Well, we can validate the format of the date using regular expression but how to validate weather that date is valid date or not, such as “2007-02-29″ is the correct format of the date but it’s not...
-
Aug 29, 2011
Comments OffBlocking access to the login page after three unsuccessful login attempts
Sometimes you need to add an extra protection to password-protected website. This article explains how access to the login page can be restricted after three unsuccessful login attempts. This schema uses visitors IP address to store log attempts in the database and block access to login feature for 30 minutes after third unsuccessful attempt. There...
-
Aug 29, 2011
Comments OffHow to Pass JavaScript variables to PHP
JavaScript is mainly used as a client side scripting language, while PHP is a server side technology. Unlike Java or ASP.Net, PHP doesn’t have tools to make it work client side. That is why you need to combine JavaScript and PHP scripts to develop powerful web-applications. One of the frequent problems is defining visitor’s screen...
-
Jul 28, 2011
Comments OffJquery Mouseover Tooltip Plugin
Let’s review a topic about how to create Jquery Mouseover Tooltip Plugin. Have you ever seen Jquery Mouseover Tooltip Plugin ? … Like this below: Link Nudging Or, Naruto Image How to do ? … 1. Go to Dashboard, click Design, click Edit HTML 2. Find code of HTML below: </head> you can use (Ctrl+F)...
-
Jul 28, 2011
Comments OffJquery Thumbnail Image with Heading and Caption
Let’s review a topic about how to create a Jquery Thumbnail Image with Heading and Caption. Have you ever seen Jquery Thumbnail Image with Heading and Caption ? … Like this below: Click Here to See the Example how to create a Jquery Thumbnail Image with Heading and Caption ? … First Step; 1. Go...
-
Jul 28, 2011
Comments OffSliding Letters with jQuery
Example In the following we will go through an example and we’ll start by the html for a little menu: 1 <div class="sl_examples"> 2 <a href="#" id="example1" data-hover="Creativity">Illustrations</a> 3 </div> We will use data-hover to indicate the word that should appear on hover. If you don’t use the data-hover then the same word will be...
-
Jul 28, 2011
Comments OffCSS and jQuery Tutorial: Fancy Apple-Style Icon Slide Out Navigation
1. The HTML The markup just consists of a div with an unordered list inside. The list elements contain a span for the icon and the link element: 01 <div class="navigation"> 02 <ul class="menu" id="menu"> 03 <li><span class="ipod"></span><a href="" class="first">Players</a></li> 04 <li><span class="video_camera"></span><a href="">Cameras</a></li> 05 <li><span class="television"></span><a href="">TVs</a></li> 06 <li><span class="monitor"></span><a href="">Screens</a></li> 07 <li><span class="toolbox"></span><a...
-
Jul 28, 2011
Comments OffjPaginate: how to add a Fancy jQuery Pagination Plugin
jPaginate is a jQuery pagination plugin that comes with a twist: animated page numbers. The user can slide through the available page numbers by clicking or just hovering over the arrows. Shortlinks to the first and last page are available as well. You can call the plugin in the following way: $(elementID).paginate() You can...
-
Jul 28, 2011
Comments OffTwitter API and jQuery Showcase: Display your Followers or Friends
Today I was playing around with the Twitter API and created this little “widget” using jQuery and PHP. I know, there are already plenty of them, but I wanted to improve some details. Some of the features are: You can get your most recent 100 followers or friends Followers or friends are shown in...
-
Jul 28, 2011
Comments Offall Fixed Fade Out Menu: A CSS and jQuery Tutorial
1. The HTML The markup is pretty simple: we have a div with a list inside. The list items will be our links, the search input and the arrow buttons: 01 <div id="nav"> 02 <ul> 03 <li><a class="top" href="#top"><span></span></a></li> 04 <li><a class="bottom" href="#bottom"><span></span></a></li> 05 <li><a>Link 1</a></li> 06 <li><a>Link 2</a></li> 07 <li><a>Link 3</a></li> 08 <li><a>Link 4</a></li>...
-
Jul 28, 2011
Comments Offhow to add Beautiful Slide Out Navigation: A CSS and jQuery Tutorial
1. The HTML Structure The only thing we will need for the navigation is a simple unordered list with links inside of the list elements: 1 <ul id="navigation"> 2 <li class="home"><a title="Home"></a></li> 3 <li class="about"><a title="About"></a></li> 4 <li class="search"><a title="Search"></a></li> 5 <li class="photos"><a title="Photos"></a></li> 6 <li class="rssfeed"><a title="Rss Feed"></a></li> 7 <li class="podcasts"><a title="Podcasts"></a></li> 8 <li...
-
Jul 28, 2011
Comments Offhow to add Sweet Thumbnails Preview Gallery
The Markup The HTML structure is going to consist of a main container which will have the image wrapper for the big image, the navigation items and the dot list with the thumbnail preview: 01 <div id="ps_container" class="ps_container"> 02 <div class="ps_image_wrapper"> 03 <!-- First initial image --> 04 <img src="images/1.jpg" alt="" /> 05 </div> 06...
-
Jul 27, 2011
Comments OffjQuery Dialog Box Tutorial
Recently on a coding project for my day job I had a requirement to display a dialog box to confirm that when someone clicked a cancel link that they meant to do the cancel action. The dialog box was on a page that built a list of links with multiple cancel links, each with a...
-
Jul 22, 2011
Comments Off
-
Jul 22, 2011
Comments Off
-
Jul 22, 2011
Comments OffDisable combobox items in IE
Copy and Paste the code below. Here’s the scenario: Your boss wants you to disable certain items inside the combobox. No problem, you create a select tab, put up an options inside it,disabled the items, and run it in firefox. Ahhh, run as expected. You then hand it to your boss. *Gasp*, your boss’ browser...
-
Jul 22, 2011
Comments Offjavascript div fade-in/fade out
Ok, to save yourself from hair-pulling, thought I’ll post this one for convenience. I gave a couple of minutes reading the codes and tweaking it a bit and wonder how many of you did the same…Anyways, this is a derivative from a very handy fade-out/fade in by a div on this blog. My version is...
-
Jul 22, 2011
Comments OffJavascript sample paging
I search the net for hours and found none about paging that’s simple that I can just copy and paste. So I created one. Just download the HTML and JS file, put it in the same directory and fire away. (Instructions on how to use is located on the javascript file). Click here to see...