Tag Archives: programming

Event Bubbling In JavaScript / JQuery

By Sam | Published: August 14, 2010
Lynda.com has a great series of tutorials on JavaScript, here. One of the exercises was an event bubbling demo, written in JavaScript. It illustrates how events on a DOM element, bubble-up to the parent elements. I have re-written it below in JQuery. Click in ‘div 3′ to see the event propogate. You may need to [...]
Posted in Software Development | Also tagged , , | Leave a comment

dont fetch the count in loops repeatedly!

By Sam | Published: July 28, 2010
This should have been really obvious, but I haven’t really thought about what happens when you do for(var i =0; i < total(); i++) with respect to the function total(), which gets called over and over again. If that function has to search through a large document, and total is large, then this could be [...]
Posted in Software Development | Also tagged | Leave a comment

Chaining JQuery Show/Hide Using Callbacks

By Sam | Published: July 20, 2010
$ = jQuery.noConflict(); var speed = 500; $(function() { $("#hide").hide(); $(".blueBox").hide(); $("#show").click(function() { $(this).hide(); $("#1").show(speed, function() { $("#2").show(speed, function() { $("#3").show(speed, function() { $("#4").show(speed, function() { $("#5").show(speed,function() { $("#6").show(speed, function() { $("#hide").show(); }) }) }) }) }) }) }); $("#hide").click(function() { $(this).hide(); $("#6").hide(speed, function() { $("#5").hide(speed, function() { $("#4").hide(speed, function() { $("#3").hide(speed, function() { $("#2").hide(speed,function() [...]
Posted in Uncategorized | Also tagged , , , | Leave a comment

mouseover/mouseout v.s. mousenter/mouseleave events in JavaScript and JQuery

By Sam | Published: July 18, 2010
.yellow { width:160px; padding:20px; height: 160px; background-color:yellow; } .highlight { background-color:red; } .inner { width:50px; height:50px; border:solid black 1px; } jQuery(function() { jQuery("#example1").bind("mouseenter", highlight); jQuery("#example1").bind("mouseleave", highlight); jQuery("#example2").bind("mouseover", highlight); jQuery("#example2").bind("mouseleave",highlight); jQuery("#example3").bind("mouseover", printEvent); jQuery("#example3").bind("mouseout", printEvent); }); function printEvent(evt) { jQuery("#events").append(evt.type + " "); } function highlight(evt) { jQuery(this).toggleClass("highlight"); } The typical event example, and the one used [...]
Posted in Software Development | Also tagged , , | Leave a comment

Including CSS and JavaScript in WordPress Posts Using ‘Custom Fields’

By Sam | Published: July 1, 2010
I recently switched the wordpress editor into HTML only mode. That means I disabled the visual editor, in favor of a window where you just type in markup. This method grows on you, especially if you are pretty fluent in developing HTML code. The natural extension of writing raw html, is to be able to [...]
Posted in Software Development | Also tagged , , | Leave a comment