Friday, May 1, 2009

[jQuery] Incorporating SVG Roundies Via jQuery

QUESTION: What is the best way to incorporate SVG Roundies into a
jQuery controlled webpage?

BACKGROUND: Before I began using jQuery the following block of code
was included in a <script> tag in the <head> tag of a Dreamweaver
template. I have since moved it to an external JavaScript document
that includes the jQuery ready() function and various other jQuery
methods that I have created using JavaScript. The code in question
resides in this document completely independent of any other
Javascript or jQuery code.

This set-up works fine in both of the previously described
environments and has been tested in Firefox, Opera, and Safari. I
have not tested it in any version of IE, where I have been warned that
it is likely to fail.

The CODE:

SVG_roundies.querySelectorAll = function(selector) {
var headings = document.evaluate('//*[contains(@class, "' +
selector.substr(1) + '")]',
document, null,
XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null)
var results = new Array();
var oneheading;
while (oneheading = headings.iterateNext())
results.push(oneheading);
return results;
}
window.addEventListener('load', function() { SVG_roundies.addRule
('.Square', '10em 0em'); }, false);

PROBLEM: There is an adage that says, "If it ain't broken, don't fix
it". My concern is that someday a problem could result, because I
have not integrated this code in a way that is fully compatible with
jQuery. My template is still in a state of development, and I have
plans to add a significant additional amount of JavaScript before it
is complete. Are there adjustments that I could make to achieve
better integration?

Roddy

No comments: