Recent Notes
Displaying keyword search results 41 - 46
Created by James on November 19, 2009 04:55:01
Last update: November 19, 2009 04:55:01
JavaScript
<script type="text/javascript">
<!--
if ...
CSS
<img src="http://www.thedomain.com/images/cool...
Created by James on October 11, 2009 21:15:53
Last update: October 11, 2009 21:19:39
Many techniques for making rounded corners do not work well when the element being rounded is displayed on a background with a different color (or multiple colors).
Example 1: Nifty Cube with JavaScript
<html>
<head>
<base href="http://www.html.i...
Example 2: modx Simple Rounded Corner Box
<html>
<head>
<title>Round Corner</title>
...
Example 3: CSS3 (does not work in IE)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" ...
Example 4: This is one that actually works ! The nifty corner technique can be tweaked to be background friendly, although the JavaScript version didn't work for some reason.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" ...
Created by James on July 19, 2009 23:29:42
Last update: July 19, 2009 23:33:24
Existing techniques use background images to make round corners. I present a technique here that uses four foreground images: .
I think this technique is easier to understand and use. The only requirements are:
Add position: relative to the CSS for the box to be rounded
Matching border and color between the box to be rounded and the corner images
Here's the HTML with static elements:
<!doctype html public '-//W3C//DTD HTML 4.01//EN' ...
The markup is even easier if we use jQuery to add the corners dynamically:
<!doctype html public '-//W3C//DTD HTML 4.01//EN' ...
This is the result:
Created by James on July 05, 2009 02:21:15
Last update: July 05, 2009 02:25:20
This is a JavaScript wrapper for Bare Naked App's progress bar.
As usual, download their images and add this to the CSS:
img.progressBar {
background: white url(images...
Then, add my JavaScript function, which takes a parent HTML element as input and returns the progress bar object with a setValue method:
function createProgressBar(elem) {
var img = d...
Test code:
<html>
<head>
<!-- setup code START -->
...
Created by Dr. Xi on April 22, 2007 21:58:45
Last update: January 19, 2009 20:26:12
Your code will be syntax highlighted when you specify the language of your code with the BBcode code tag:
[code=lang] Your code here [/code]
where "lang" is the language of your code. For example, the following Perl code
#!/usr/bin/perl
print "Hello World!\n";
is rendered with:
[code=perl]
#!/usr/bin/perl
print "Hel...
The following are supported languages and their corresponding names for BBcode:
Apache conf: apacheconf, aconf, apache
Bash...
The full list is available from http://pygments.org/ , which is our backend engine for syntax highlight rendering.
Created by Dr. Xi on September 07, 2008 21:14:46
Last update: September 07, 2008 21:14:46
In the simplest form, JavaScript debugging is simply looking at the JavaScript error messages. For IE, there's a yellow mark at the left bottom screen of the browser when a JavaScript error occurs. For Firefox, you need to enter javascript: in the address bar to see the JavaScript errors. These simple tools aren't enough when your JavaScript s become less simple. For IE, you can use the "Microsoft Script Debugger" or "Microsoft Script Editor", which comes with Microsoft Office. This is a pretty good tutorial on the subject: http://www.jonathanboutelle.com/mt/archives/2006/01/howto_debug_jav.html For Firefox, I use firebug , which not only allows you to debug JavaScript, but also to inspect the HTML, DOM and CSS on the page. I use it a lot to modify the CSS on...