[Javascript] How to separate the href

[Julien Nadeau]

My guess is that you could use the href, however you'd have to remove  
it when the page loads and save the values as variables to be used  
later. That would make your script qualify as "non-obstrusive" since  
non-javascript browsers could still see the pictures.

You could probably use something like this (not tested, but I believe  
it should work), but you would have to set a specific identifier for  
each item (eg. id="img1").

for your body onLoad (this should be ran when the whole page is done  
loading):

function onLoad() {
     var el = document.getElementsByTagName('a');
     imgList = new Array();
     for (i=0; i<el.length; i++) {
         var index = el.getAttribute('id').replace('img', '') * 1;
         imgList[index] = el.getAttribute('href');
         el.setAttribute('href', '#');
     }
}

now, you should have an array filled with the hrefs from your <a>  
tags (theses could be child of a container to restrain the search  
like this: document.getElementById('container').getElementsByTagName 
('a')).

then in your loop -

[...]
     if (document.getElemebtById) {
         var cur_index = obj.getAttribute('id').replace('img', '') * 1;
         document.getElementById('placeholder').src = imgList 
[cur_index];
     }
[...]

I'm relatively new to JS too, so I'm not entirely positive this would  
set imgList as a global, but I think it will. If it's not, you can  
try just throwing the imgList = new Array(); outside the function,  
might work too.

Julien Nadeau
junado at junado.com

Le 05-08-10 à 20:20, Scott Moore a écrit :

> I'm using this script...
>
> var Ary=new Array();
> function showPic (obj,whichpic) {
>     if (!obj.set){
>      obj.set=true;
>      Ary[Ary.length]=obj;
>     }
>     for (i=0;i<Ary.length;i++){
>      Ary[i].className='notselected';
>     }
>     obj.className='selected';
>         if (document.getElementById) {
>                 document.getElementById('placeholder').src = whichpic;
>         }
> }
>
> ...which gives the CSS class of selected to a thumbnail when it's  
> clicked and displays the larger version of the image where  
> id=placeholder is defined, works  as intended when called using  
> this link format.
> <a onclick="showPic(this,'img01.jpg')"></a>
>
> What I'm trying to figure out is how to modify the script to allow  
> the href to be defined outside the onclick, like this:
> <a onclick="showPic(this)" href="img01.jpg"></a>
>
> I'm also trying to figure out how to have the first thumbnail link  
> have the class=selected when the page first loads.
>
> I have a feeling this is basic stuff for the experts, but I'm still  
> learning and need some help.
>
> Scott
> _______________________________________________
> Javascript mailing list
> Javascript at LaTech.edu
> https://lists.LaTech.edu/mailman/listinfo/javascript
>
>
>

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.evolt.org/pipermail/javascript/attachments/20050811/66b0425e/attachment.htm>