Ajax Star Rating System

Have yet to try this out on any of my websites but think it would be very neat to include on any real estate or e commerce website.

——————————–

AJAX Rating Stars Demo

Examples

Simple form binding
var s1 = new Stars({ maxRating: 5, bindField: ‘myRating’, imagePath: ‘images/’, value: 4.5 });	<script type="text/javascript"> var s1 = new Stars({ maxRating: 5, bindField: 'myRating', imagePath: 'images/', value: 4.5 }); </script>
JavaScript callback function
function rating(val) { alert(‘You rated it ‘ + val + ‘ star(s)!’); } var s2 = new Stars({ maxRating: 5, imagePath: ‘images/’, callback: rating });	<script type="text/javascript"> function rating(val) { alert('You rated it ' + val + ' star(s)!'); } var s2 = new Stars({ maxRating: 5, imagePath: 'images/', callback: rating }); </script>
Sending values through AJAX
function ajaxRating(xml) { var x = xml.responseXML; var xmlRating = x.getElementsByTagName(‘rating’); var rating = xmlRating[0].firstChild.nodeValue; alert(‘You rated it ‘ + rating + ‘ star(s)!’); } var s3 = new Stars({ maxRating: 5, actionURL: ‘rate.php?rating=’, callback: ajaxRating, imagePath: ‘images/’, value: 3 });	<script type="text/javascript"> function ajaxRating(xml) { var x = xml.responseXML; var xmlRating = x.getElementsByTagName('rating'); var rating = xmlRating[0].firstChild.nodeValue; alert('You rated it ' + rating + ' star(s)!'); } var s3 = new Stars({ maxRating: 5, actionURL: 'rate.php?rating=', callback: ajaxRating, imagePath: 'images/', value: 3 }); </script>

Read more at: http://www.beauscott.com/examples/RatingStars/

Checkbox Tutorial

Very cool article explaining how to click a link and get a checkbox checked at the same time.. Very handy at times.

——————————————–

Text fields and textareas are just two types of form elements. Others that we’ll look at in this lesson are checkboxes, radio buttons, and selects. Let’s discuss checkboxes first.

Checkboxes have one main property of interest: checked.

This checkbox is checked
This checkbox is not checked
If you have a form named the_form and a checkbox named the_checkbox you can see if the checkbox has been checked like this:

var is_checked = window.document.the_form.the_checkbox.checked;
if (is_checked == true)
{
  alert("Yup, it's checked!");
} else {
  alert("Nope, it's not checked.");
}

As you can see, if a checkbox is checked, the checked property will be true. true is a built-in JavaScript datatype, so you don’t have to put it in quotes when checking it. If the checkbox is not checked, the checked property will be false (also a built-in datatype).

Just like you can read the checked property, you can set the checked property. Here’s an example of checking and setting the checked property of a checkbox:

Read more at: http://www.webmonkey.com/webmonkey/98/04/index3a_page7.html

Meta Tag Generator

Meta Tag Generator

Meta tags are a crucial part of getting your webpages rated better in search engines. Many search engines now require them before they will spider your site. Now you can generate the code for your Meta Tags quickly and easily using this online generator.

http://www.htmlbasix.com/meta.shtml

Rollovers activated for the shapes in this image.

Ever need to display rollover of multiple areas for a single image? Check out this article i found!

Imagemaps

Let’s say we want to have rollovers activated for the shapes in this image. Since this is one image, not three, we need to attach an imagemap. Mouse over the image below, and you can see it in action. As you can see from the HTML, the picture is in file shapes0.png.

<img src="rollover/shapes0.png" name="shapes" usemap="#shapemap"
    width="283" height="103" alt="square, circle, and triangle"
    border="0" />

Important: It is not possible to replace a part of an image. We have to replace the whole image, so we will need the following image files (named shapes1.png, shapes2.png, and shapes3.png):

The imagemap will look like a normal imagemap, except that we will add onmouseover and onmouseout attributes to invoke JavaScript.

<map name="shapemap">
    <area shape="rect" coords="20,17,86,88"
        href="#" onmouseover="highlight(1);" onmouseout="highlight(0);" />
    <area shape="circle" coords="134,53,30"
        href="#" onmouseover="highlight(2);" onmouseout="highlight(0);" />
    <area shape="polygon" coords="227,10,180,88,280,88,227,10"
        href="#" onmouseover="highlight(3);" onmouseout="highlight(0);" />
</map>   http://catcode.com/cit041j/js_images2.html