PDA

View Full Version : Link Colors on Switch Content Script



dmwhipp
03-03-2011, 02:30 AM
1) Script Title: Switch Content Script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/switchcontent.htm

3) Describe problem: I would like to be able to control the link colors (link, active, visited, hover) for the links to the remote content.

I've tried messing with a new CSS class, but then that removes the hand cursor/pointer effect. I also tried adding additional colors to the following line without success:

bobexample.setColor('#41cdc5','#8d0932')

Any help with this would be greathly appreciated.

Thanks,
Deborah

JohnCC
03-04-2011, 06:00 AM
Hi Deb:

Not sure, but I think you MAY just need a space after the comma. I used this script on something a while back and changed the colors fine, using...

mainpagebox.setColor('#ff0000', '#1A2E2D')

Try it with a SPACE and see if that does it ;)

dmwhipp
03-04-2011, 06:55 AM
Hi John,
I already tried that using:


trade.setColor('#8d0932', '#8d0932', '#8d0932', '#41cdc5')

I tried #41cdc5 in first, second, third and fourth positions, but was unable to get the text to change color on mouse-over (a.hover). I just hard coded the underline effect.

If you have different coding, let me know and I'll give it a shot.

Thanks,
Deborah

ddadmin
03-04-2011, 07:46 AM
If you wish to set all four states of the header links (link, active, visited, hover), your best bet is first to remove any calls to instance.setColor() inside your initialization code, as those colors will take precedence over anything you define via CSS. Then, just define a new CSS class inside your stylesheet with the desired style for the links, ie:


.headerlink:link{
color: green;
}

.headerlink:visited{
color: blue;
}

.headerlink:hover{
color: red;
}

.headerlink:active{
color: purple;
}

Then, inside the HTML markup of your header links, add the "header" class to those elements without replacing the existing class:


<h3 id="joecontent1-title" class="handcursor headerlink">What is JavaScript?</h3>
<p id="joecontent1" class="switchgroup2">
</p>

<h3 id="joecontent2-title" class="handcursor headerlink">Difference betwen Java & JavaScript?</h3>
<p id="joecontent2" class="switchgroup2">
</p>

<h3 id="joecontent3-title" class="handcursor headerlink">What is DHTML?</h3>
<p id="joecontent3" class="switchgroup2">
DHTML is the embodiment of a combination of technologies- JavaScript, CSS, and HTML. Through them a new level of interactivity is possible for the end user experience.
</p>

dmwhipp
03-04-2011, 10:03 AM
Pretty odd. I removed the setColor and added the code you suggested. The hover works now, but the link, active and visited colors no longer work and are all black.

Here's the page: http://www.collegeaccess.floridacompact.org/coordinators2.html

Deborah