Miscellaneous > Programming & Networking
I am dumb, I need help
worker201:
Not really much chance of me ever producing a vector graphics editor - I can't even get a goddamm JavaScript to work! Anybody want to help?
--- Code: ---var humpics = new Array(8);
var humtext = new Array(8);
for(var i = 0; i < 8; i++) {
humpics[i] = new Image();
humpics[i].src = "images/pic0" + i + ".jpg";
humtext[i]="text"+i;
}
function ChangeImageAndText(i)
{
var curr;
document.mainimg.src=humpics[i].src;
for (j=0; j
piratePenguin:
;)
BTW I used to use onclick on 's (like you're doing) and a guy in #web on freenode (lots of helpful people in there btw) told me I shouldn't - is for linking to different [parts of] documents - I should use (or or , whatever suits best) instead.
H_TeXMeX_H:
Don't tell me you're writing a vector graphics editor in javascript ... are you ?
xyle_one:
Use instead of
--- Code: ---
--- End code ---
You dont need the javacsript in the onclick attribute as onclick is already a javascript event handler.
xyle_one:
Of course, it would be ideal to abstract your javascript into a separate behavioral layer, so you have a lean and still accessible valid markup.
Something like this:
--- Code: ---
Untitled
function ChangeImageAndText(pic)
{
if(!document.getElementById) return false;
var source = pic.getAttribute("href");
var mainimg = document.getElementById("mainimg");
mainimg.setAttribute("src",source);
if (pic.getAttribute("title")) {
var text = pic.getAttribute("title");
} else {
var text = "";
}
var description = document.getElementById("description");
if (description.firstChild.nodeType == 3) {
description.firstChild.nodeValue = text;
}
return false;
}
function prepareImageLinks()
{
if(!document.getElementById) return false;
var humpics = document.getElementById("humpics");
var links = humpics.getElementsByTagName("a");
for( var i=0; i < links.length; i++ )
{
links[i].onclick = function()
{
return ChangeImageAndText(this);
}
links[i].onkeypress = links[i].onclick;
}
}
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
oldonload();
func();
}
}
}
addLoadEvent(prepareImageLinks);
* Image 01
* Image 02
* Image 03
* Image 04
* Image 05
* Image 06
* Image 07
* Image 08
Text Here
--- End code ---
As you can see, the actually html on the page is very light. A standard unordered list with links to the images. I have included some javascript that, once it runs, hooks into the humpics element and attaches an onclick event handler to each link in the list. The function it attaches takes the href value and replaces the placeholder image. It also takes the title attribute and replaces the text in the paragraph below it. There is also a function that allows you to load many functions at load time.
Without seeing where you are implementing this I have no idea if this is even what you are looking for.
I am just bored and waiting to get my night started :)
Navigation
[0] Message Index
[#] Next page
Go to full version