Target A tag instead of Li

[ringod]

Hello there. I have created a site using an unordered list but am having some problems with actually selecting both the li and the a tag at the same time. Its a little hard to explain but i have an example on my site:

http://www.electricwig.com/delete/testxxw3/delete/

(click on FURNITURE and then METHERINGHAM) You will notice that each clicking on each li expands some text below it and also links to a html page containing images in the right frame. My problem is that it is possible to expand the li without engaging the a tag if you click just between the li items.

I would like to make it impossible to expand the list without engaging the a tag.

I hope this makes sense, but i think that its a javascript problem?

Any help is greatly appreciated... i really am stuck and dont know alot about javascript, so please explain simply to me.

Many thanks

Ringo

var dMenu = (function(){ 


  var menu; 


  function parentLi(el) { 
    do { 
      if (el.tagName.toLowerCase() == 'li') return el 
    } while (el = el.parentNode) 
  } 


  function openParentUls(el) { 
    while (el != menu) { 
      if (el.tagName.toLowerCase() == 'ul') el.style.display = ''; 
      el = el.parentNode; 
    } 
  } 


  function closeAll(el) { 
      var el = el || menu; 
      var uls = el.getElementsByTagName('ul'); 
      var i = uls.length; 
      while(i--){uls[i].style.display = 'none';} 
    } 


  return { 
    init: function (id) { 
      if (!document.getElementsByTagName || 
          !document.getElementById ) { 
        return; 
      } 


      menu = document.getElementById(id); 


      if (menu) { 
        this.closeAll(menu); 
        var uls = menu.getElementsByTagName('ul'); 
        var i = uls.length; 
        while (i--) { 
          parentLi(uls[i]).onclick = this.doClick; 
        } 
      } 
    }, 


    closeAll: function (el) { 
      closeAll(el); 
    }, 


    doClick: function(e) { 
      var e = e || window.event; 
      var tgt = e.target || e.srcElement; 


      e.cancelBubble = true; 
      if (e.stopPropagation) e.stopPropagation(); 


      while (tgt != this) { 
        if (tgt.tagName.toLowerCase() == 'ul') return; 
        tgt = tgt.parentNode; 
      } 


      var firstUl = this.getElementsByTagName('ul')[0]; 
      var firstUlDisplay = firstUl.style.display; 
      closeAll(menu); 
      openParentUls(this); 
      firstUl.style.display = ('none' == firstUlDisplay)? '' : 'none'; 
    } 


  } 



})();

 

[feherke]

Hi

Remove the [tt]5px[/tt] [tt]padding[/tt] value and give them to the [tt]margin[/tt].

Feherke.

http://rootshell.be/~feherke/

 

[ringod]

Hi feherke

Thanks for the help, and it works, but i would like to keep the same spacing between each line of the lists. Is there keeping it looking the same but solving the problem.

All the best

Tim

 

[BillyRayPreachersSon]

I would like to make it impossible to expand the list without engaging the a tag.

Then why are you explicitly adding an onclick function to each UL if you don't want that behaviour?

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[ringod]

Hi Dan

That sounds like a very good point, my only problem is that im not sure how to change that behaviour. When i said that i dont know alot about javascript i probably should have said that i know very little. I have tried fiddling with the code but i dont seem to be able to get anywhere. Would the solution be as simple as replacing 'ul' or 'li' for 'a' in places or is it far more complicated?

Many thanks

Tim

 

[monksnake]

I was going to help, then I decided that the code is a complete copy/paste job and knew the OP wouldn't learn a thing from the help.

<.

 

[ringod]

Hi monksnake

You are right in that someone has helped me with the Javascript, but my reason for knowing very little about it is that im currently putting most of my efforts in learning css and html. I am interested in learning about javascript, its just alot to take on all at once.

Regards
TIm