Miscellaneous > Programming & Networking

I am dumb, I need help

<< < (6/9) > >>

xyle_one:

--- Quote from: worker201 ---No.  No internet connection at home.

I'd say "fuck it", but I really want to learn how your design works, and what, if anything, about it is better than the one I already have.  For educational purposes, if nothing else.
--- End quote ---


Ok. Check back tomorrow and you will have answers. You only need to slightly adjust your markup. You will need to add title attributes to your anchors.


EDIT: Updated with code examples.
The benefit in doing it "my" way is that your javascript is completely separated from the markup. I am using the DOM to hook into the markup to give it its behavior.

I did adjust your markup, but only to remove the onclick event handlers and the unordered list of descriptions. The descriptions are now apart of the anchor title for each thumbnail. I suppose I could have added them to the img alt description, or just left them alone and wrote something to handle it. Perhaps you can take what I have started and customize it for your needs.

imageGallery.js

--- Code: ---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("text");
if (description.firstChild.nodeType == 3) {
description.firstChild.nodeValue = text;
}
return false;
}

function prepareImageLinks()
{
if(!document.getElementById) return false;
var humpics = document.getElementById("wrapper");
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);

--- End code ---

The first function, showPic, handles the image & text swapping. prepareGallery() dynamically adds an onclick event handler to all links within "wrapper". addLoadEvent() is used to load the prepareGallery function when the page is finished loading.

The changes to your markup:

--- Code: ---

piratePenguin:

--- Quote from: worker201 ---btw, xylon, here's an example of what the JavaScript does (working okay now):
http://www.triple-bypass.net/brickpics/pimpmech/pimp.htm

Would your replacement script do the same thing?
--- End quote ---
Wanna see what your page looks like when it's sent as application/xhtml+xml?

http://piratepenguin.is-a-geek.com/~declan/crap/worker/pimp.xhtml

Hehe

See - in it's current state, no browser is treating the page as XHTML. If they were, they'd throw that error, since it aint well-formed XML ;)

worker201:

--- Quote from: piratePenguin ---Wanna see what your page looks like when it's sent as application/xhtml+xml?

http://piratepenguin.is-a-geek.com/~declan/crap/worker/pimp.xhtml

Hehe

See - in it's current state, no browser is treating the page as XHTML. If they were, they'd throw that error, since it aint well-formed XML ;)
--- End quote ---
I just went there and asked Firefox (1.0.8, fyi) to show me the source.  All the self-close slashes were missing for some reason.  Meaning, it gave this:

--- Code: ---
--- End code ---
instead of this:

--- Code: ---
--- End code ---
Also the XML opening tag was missing:

--- Code: ---
--- End code ---
So what happened, eh?  The page is in fact well-formed, according to W3C guidelines.  I think what happened is that you did a "save webpage" thing or something, and it pulled the page down as HTML, which is how the browser interpreted it.  Check my source and you will see that the code is well-formed, and validates flawlessly.

piratePenguin:

--- Quote from: worker201 ---I just went there and asked Firefox (1.0.8, fyi) to show me the source.  All the self-close slashes were missing for some reason.  Meaning, it gave this:

--- Code: ---
--- End code ---

instead of this:

--- Code: ---
--- End code ---

Also the XML opening tag was missing:

--- Code: ---
--- End code ---

So what happened, eh?  The page is in fact well-formed, according to W3C guidelines.  I think what happened is that you did a "save webpage" thing or something, and it pulled the page down as HTML, which is how the browser interpreted it.  Check my source and you will see that the code is well-formed, and validates flawlessly.
--- End quote ---
Bah, didn't recall that save page as fucked everything up.

But anyhow when I wget'ed the page it rendered the same as XHTML.

Lucky there's no background colour set ;)

(then it would be this versus this)

btw one of the selling points of XHTML is that you don't have to go to the W3C validator to catch well-formedness errors ;)

xyle_one:
Why does it matter? Not all browsers support the proper mime type to serve an XHTML1.1 Strict page anyways.

Navigation

[0] Message Index

[#] Next page

[*] Previous page