|
Hello,
I have a simple menu bar base on a ul li list with embedded hyperlinks.
<ul>
<li id="menuHome"><a href="index.html" onMouseOver="setMenu('menuHome')" >Home</a></li>
<li id="menuResults"><a href="results.htm">Results</a></li>
<li id="menuEvents"><a href="events.htm">Events</a></li>
</ul>
I have set the CSS properties such as
#menuHome {
background-color: #CCC;
color: #000;
}
#navleft ul {
list-style: none;
padding: 0;
margin: 0 0 5px 0 ;
text-align: left;
}
#navleft li {
margin: 5px 0;
line-height: 23px;
}
#navleft li a {
text-decoration: none;
padding-left: 9px;
display: block;
width: 140px;
}
My Java script is quite basic
function setMenu( id )
{
var e = document.getElementById(id);
e.style.backgroundColor = 0x666666;
e.style.color = 0xFFFFFF;
}
My goal is to basically have a vertical menu bar that can be used for multiple webpages, so that after the user clicks on it, it will change the background color and text to a different color, so that it is apparent which page the user is on.
(I realize that I'm using the mouse hover for testing, it stops the page from reloading every time I test it).
The problem that I am having, if my understanding is corrent is that the tag that I pass in the jave call is bond to the "li" element of the menu list, the background color changes quite fine, but, I can not seem to be able to access the color property of the "a href" tag to change the text from black to white.
using the e.style example above how would to "Cast it" to the a reference?
Thank you in advance.
|
|
|
|
|
Your problem is the result of you passing the ID of the LI element to the setMenu function. So all text in this LI element will change color just like you thought, except for text inside anchor tags (A).
You will need to set the color for these tags manually. You could do this using the getElementsByTagName method to obtain all A tags inside your LI tag like:
function setMenu( id ){
var e = document.getElementById(id);
e.style.backgroundColor = 0x666666;
e.style.color = 0xFFFFFF;
var allATags = e.getElementsByTagName('A');
}
All you would have to do then is set the color for each element in the resulting array allATags.
|
|
|
|
|
Hello thank you for your reply.
allATags.item(0).style.color = 0xFFFFFF;
OK so if I index '0' which I know is the first one in my list, it affects the proper tag.
Question, because I called this function "setMenu" with the id tag "menuHome", will all references be to this one line item, or should I say all element or nodes downstream from the "menuHome" id?
My wording is not the best sorry, but I will not be able to effect other menu items in my list?
<li id="menuHome"><a href="index.html" onMouseOver="setMenu('menuHome')" >Home</a></li>
Thank you in advance
|
|
|
|
|
Since you are using e.getElementsByTagName (which is the element with id menuHome) all A elements returned are children of <li id="menuHome">. So you can safely loop through them and set there color.
|
|
|
|
|
This isn't a programming question per se, more that I've bitten off more than I can comfortably chew and could use some resources and design suggestions.
Over the next couple of months, I will be developing a website for a volunteer charity with 22 local groups around the US. The site will have a section for the charity as a whole, and sections for each of the local groups. Each section will have public and private areas, with all the private areas available to all registered users (meaning any registered user will have access to every private area.) National and the local groups will be able to upload and remove documents relevant to their group, change information on their group's public contact page and manage registered access to the site for their group's volunteer members; most likely, this work will fall to local membership coordinators, who may or may not be technologically savvy, and to the organization's webmaster, who hopefully will know what s/he is doing. In addition, all logged in users will be able to participate in a discussion board. Because of the nature the work the charity does, using public resources such as Google Documents is strongly discouraged. The parent organization for this charity will be hosting the site, so I likely will have only FTP access to the servers.
Creating a secure system and managing users is old hat, and I have set up systems to allow remote users to manage data for display on a templated web page. What I do not know how to do is create a system where remote users can upload and manage documents that will be available for download, and how to write and manage a message board system. Most likely I will be using IIS and ASP.Net for the server-side coding. Any suggestions, links, references, books, etc. would be most appreciated.
|
|
|
|
|
Rather than build an entire system from scratch, take a look at DotNetNuke.
http://www.dotnetnuke.com/[^]
You can find hosting companies that specialize in hosting DotNetNuke (DNN) websites. This is an ideal configuration for you because you can have a top-level administrator for the entire USA and create local admins which will have control over their own section of the site. Really very cool stuff.
Also, check out the huge amount of 3rd party add-ons (modules) that are available for DNN at Snowcovered.com
http://www.snowcovered.com/Snowcovered2/Default.aspx[^]
I used DNN at a previous job to build a really cool intranet / extranet and like the technology alot.
My 2 cents. 
Good luck
|
|
|
|
|
Agreed, dotNetNuke is pretty good and probably the best one out there.
A second option would be http://www.mojoportal.com/[^]. I've played with this one on my home systems and found it to be reasonably good.
I wasn't, now I am, then I won't be anymore.
|
|
|
|
|
I've heard of DNN, of course, but I've never really looked at it. It definitely seems like it would answer my needs, thanks!
|
|
|
|
|
Gregory.Gadow wrote: It definitely seems like it would answer my needs
Only if your needs are slow, bloated, difficult to maintain VB.net code.
You may also want to look at Drupal[^] though it may be more than is necessary for you.
I know the language. I've read a book. - _Madmatt
|
|
|
|
|
I was about to suggest Drupal, but I see Mark beat me to it. If you go that way, join the support mailing list. It's an awesome resource...
Cheers,
Peter
Software rusts. Simon Stephenson, ca 1994.
|
|
|
|
|
On our web app we've been allowing the user to download the audio files they create/upload for quite a while using the same method. A few months ago that changed a little bit but nothing drastic. Recently (i found out about it the other day, dont know when it first started) any time a user downloads a .wav file via Safari (tested with 5.0.3) or Firefox(3.6.11 or 3.6.13) the last bit of the wave file gets corrupted. In Adobe Audition it just loops the second or two of audio before the corruption for the rest of the file in windows media it just stops playing. Downloading the same file from the same account in IE8 works perfectly. It isnt always the last 3 seconds, it seems to be the last 10 or 15% of the file(percentages are a rough guess) that has the problem.
I've been googling, but with little luck, and have no idea what could cause this. I've also gone through the FF revision list back to 3.5.9(last known working version) but didnt see anything that seems related. I was thinking a fix in a more recent version may have caused the problem.
Any help or ideas would be appreciated,
John
Please remember to rate helpful or unhelpful answers, it lets us and people reading the forums know if our answers are any good.
|
|
|
|
|
I was trying to get a gridview and a set of text boxes .side by side (Left to Right-Parallel) in a Row.
This renders fine - in IE,Firefox and Opera.How ever in google chrome the text boxes are rendered below the grid (top down -instead of side by side).
can any one advise on this.where could i be going wrong ?
<table align="left">
<tr align="left">
<td align="left" >
<fieldset style=" color: Black; width:621px; border-color: DarkGray">
<table>
..... A gridview
</table>
</fieldset>
</td>
<td >
<fieldset style=" color: Black;width:485px; border-color: DarkGray">
<table style="width: 490; font-family: Calibri; font-size: medium">
..... Some text Boxes
</table>
</fieldset>
</td>
</tr>
</table>
|
|
|
|
|
|
Hi,
I have a very simple 2X2 table as follows:
<table id="temp1" width="200px" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<img id="Img4" src="images/Logo100X100.jpg" height="100px" width="100px" />
</td>
<td>
<img id="Img1" src="images/Logo100X100.jpg" height="100px" width="100px" />
</td>
</tr>
<tr>
<td>
<img id="Img2" src="images/Logo100X100.jpg" height="100px" width="100px" />
</td>
<td>
<img id="Img3" src="images/Logo100X100.jpg" height="100px" width="100px" />
</td>
</tr>
</table>
When the table renders, there is no vertical space between neighbouring horizontal images; however, there is a persistent small border at the bottom of each image. Nothing I do seems to affect its width or get rid of it (which is what I really want). Does anyone have any idea where this might be coming from? (I have checked the images themselves, and they have no border.)
Any help would be very much appreciated.
Best wishes, Patrick
|
|
|
|
|
Patrick Skelton wrote: there is no vertical space between neighbouring horizontal images;
Try this code
<table id="temp1" width="210px" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<img id="Img4" src="1.JPG" height="100px" width="100px" />
</td>
<td>
<img id="Img1" src="1.JPG" height="100px" width="100px" />
</td>
</tr>
<tr><td colspan="2"> </td></tr>
<tr>
<td>
<img id="Img2" src="1.JPG" height="100px" width="100px" />
</td>
<td>
<img id="Img3" src="1.JPG" height="100px" width="100px" />
</td>
</tr>
</table>
|
|
|
|
|
Hi,
Thank you for the reply.
The code gives me an equal border horizontally and vertically, which is neater, but I would still like to know if it is possible to have images within the cells of a table touching each other on all sides. I find it very difficult to believe this is not possible.
I can (and probably should) do what I want with DIVs, but it is annoying me that I can't get rid of the space in the tables. Where are they coming from?
Best wishes, Patrick
|
|
|
|
|
|
Hi,
I think it looks fine in most browsers; however Internet Explorer (and the WebBrowser Control) feel a need to add two pixels worth of white height. I'd call that a bug.
Luc Pattyn [Forum Guidelines] [My Articles] Nil Volentibus Arduum
Please use <PRE> tags for code snippets, they preserve indentation, improve readability, and make me actually look at the code.
|
|
|
|
|
It's a bug in IE - the white space inside the table cell is taking up some space. Try this:
<table id="temp1" width="200px" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><img id="Img4" src="images/Logo100X100.jpg" height="100px" width="100px" /></td>
<td><img id="Img1" src="images/Logo100X100.jpg" height="100px" width="100px" /></td>
</tr>
<tr>
<td><img id="Img2" src="images/Logo100X100.jpg" height="100px" width="100px" /></td>
<td><img id="Img3" src="images/Logo100X100.jpg" height="100px" width="100px" /></td>
</tr>
</table>
|
|
|
|
|
Hi,
Thanks to everyone who has replied.
I've tried the code suggested by Graham Breach, but unfortunately I still get a 4-pixel horizontal gap in IE8.
A couple of comments have suggested this is an IE bug, so I tried it in Chrome, and I got a 5-pixel gap in that, so there is some other dark force at work here.
I can do what I need with DIVs, but it is very annoying.
Best wishes, Patrick
|
|
|
|
|
hello Friends,
I have recently started this project http://www.bharatdesi.com
Can yan one suggest me some good developers...
Thanks for your time...
|
|
|
|
|
If you want to employ someone to help with your site then please post in the jobs forum. This forum is for technical questions.
I must get a clever new signature for 2011.
|
|
|
|
|
ok sir ... would you refer me some ....
|
|
|
|
|
Did you read my reply? Post your question in the correct forum, and people who are interested in helping will answer you.
I must get a clever new signature for 2011.
|
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
