Notes by James
Displaying keyword search results 1 - 10
Created by James on June 22, 2010 18:56:40
Last update: February 13, 2012 10:25:47
Version 1.6.4:
<!-- jQuery -->
<script type="text/javascript" ...
Version 1.7.1:
<script type="text/javascript" src="https://ajax.g...
Google URL: http://code.google.com/apis/ajaxlibs/documentation/#jquery
Created by James on January 11, 2011 22:08:26
Last update: February 03, 2012 11:23:25
By default Firefox puts a dotted line box around the link or button label when you click them. Sometimes it's annoying and makes your sexy buttons look ugly. You can get rid of the dotted lines for links with outline:none in CSS, but that doesn't work for buttons.
<!doctype html>
<html>
<head>
<style t...
For buttons you need " button::-moz-focus-inner { border: 0; } ":
<!doctype html>
<html>
<head>
<style t...
I've also seen this:
/* get rid of those system borders being generated...
For more information :
Remove Button Focus Outline Using CSS
Created by James on January 26, 2012 21:23:56
Last update: January 26, 2012 21:23:56
In an HTML page, elements can overlap because of position styles. When there's an overlap, elements coming later in the HTML code are displayed on the top. This can be altered by specifying z-index in the CSS. Elements with higher z-index are placed on the top.
However , z-index only works for elements that are not static positioned. Static positioned elements are always at the bottom compared to relative , fixed and absolute positioned elements.
This is a test page:
<!DOCTYPE html>
<html>
<head>
<style t...
Effects of z-index can be tested by adding it to the elements, for example:
<div id="bg" class="big" style="z-index: 3"></div>...
Created by James on January 16, 2012 10:05:10
Last update: January 16, 2012 10:06:13
There are two ways to get the submit button:
Use the :submit selector (note the space between the form name and :submit ):
$('#the-form-id :submit')
Use attribute selector (also, space between form id and attribute selector):
$('#the-form-id [type="submit"] ')
// or
$(...
jQuery recommends the latter if you are concerned about performance:
Because :submit is a jQuery extension and not part of the CSS specification, queries using :submit cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. For better performance in modern browsers, use [type="submit"] instead.
Created by James on September 23, 2010 20:30:55
Last update: November 16, 2011 14:51:23
jQuery button set where one button can be pressed "down" at a time.
<!DOCTYPE html>
<html>
<head>
<title>jQu...
Created by James on January 10, 2011 12:35:53
Last update: November 04, 2011 19:28:03
The events mouseover and mouseout are fired when the mouse enters/leaves the element where the event handlers are registered, and any nested elements which do not handle these events (because of event bubbling ). The events mouseenter and mouseleave are fired only when the mouse enters/leaves the specified element. Nested elements do not come into play. This following is a test page. You need Firebug to view the console output. Or use the JavaScript Executor bookmarklet. If none of these are available, an alert will popup (but you won't be able to fully test with alert.).
<!DOCTYPE HTML> <html> <head> <title>jQu... For the above test page, when you move the mouse through both the outer and inner areas of the mouseover/mouseout rectangle, the output is...
Created by James on May 19, 2011 16:02:40
Last update: May 19, 2011 16:05:05
Finally, MathJax makes showing math equations in the browser a reality! Here are some simple demos.
A simple example:
<!doctype html>
<html>
<head>
<title>Math...
Add HTML styling for Firefox:
<!doctype html>
<html>
<head>
<title>Math...
Created by James on May 01, 2011 21:57:33
Last update: May 01, 2011 21:57:33
Both visibility:hidden and display:none hides an element in the DOM. But elements with visibility:hidden still takes up space, while display:none does not.
Example (click the divs to hide or show):
<!doctype html>
<html>
<head>
<style t...
Created by James on March 29, 2011 11:37:53
Last update: March 29, 2011 11:37:53
The test page below reports the column and row indexes of the table cell you clicked.
<!DOCTYPE html>
<html>
<head>
<title>jQu...
Created by James on March 29, 2011 11:34:53
Last update: March 29, 2011 11:34:53
The width() function returns the width of an element. The test page below shows how to retrieve widths for table cells. The row parameter can be omitted if columns in all rows are of same width.
<!DOCTYPE html>
<html>
<head>
<title>jQu...
