Log in

View Full Version : 2 classes for the same text


MTD
08-22-2006, 03:47 PM
How can I add two classes to the same link? (One of the classes is set up with javascript, the other is just a normal CSS style)
DimX
08-22-2006, 03:50 PM
class="classone classtwo"
MTD
08-22-2006, 10:42 PM
i tried that, but for some reason it doesn't seem to work.
ItsMeOnly
08-22-2006, 11:12 PM
then you must be testing on some very outdated browser, like IE5.0
Twey
08-22-2006, 11:22 PM
Could you provide a demo?
mburt
08-23-2006, 12:10 AM
I'm not really sure of the question in hand, either.
jscheuer1
08-23-2006, 06:18 AM
<a href="some.htm" class="classone classtwo">Link Text</a>

is the proper way to do this in an HTML tag. If you are setting things via javascript, it would depend upon just what you wanted to do. If you want to take the existing className and add to it:


el.className=el.className+' classtwo';

where the variable 'el' represents the element that you want to do this to. Removing the second class could be done like so:


el.className=el.className.replace(/ classtwo/, '');

There are so many ways to do things in javascript though, the above are just examples - ideas. Exactly how you go about this should be tailored to all possible situations that could arise on your page(s) that use the code.
MTD
08-23-2006, 04:29 PM
So, here is the code that I'm trying to use. the two classes work fine seperatly, just not together.


<head>
<style type="text/css">
.xlink {cursor:url("pound.cur")}



</style>


<script type="text/javascript">
var bulletimg='<img id="bullet" style="position:absolute; left: -300px" src="bah.gif">'

var bulletoffX=2 //Set horizontal offset of bullet image from link's root. (ie: -2 or 5)
var bulletoffY=8 //Set vertical offset of bullet image from link's root. (ie: -2 or 5)

function caloffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}

function displaybullet(linkobj){
bulletobj.style.left=caloffset(linkobj, "left")-bulletobj.width-bulletoffX+"px"
bulletobj.style.top=caloffset(linkobj, "top")-bulletoffY+linkobj.offsetHeight/3+"px"
bulletobj.style.visibility="visible"
}

function modifylinks(){
bulletobj=document.all? document.all.bullet : document.getElementById("bullet")
for (i=0; i<document.links.length; i++){
if (document.links[i].className=="ddbullet"){
document.links[i].onmouseover=function(){displaybullet(this)}
document.links[i].onmouseout=function(){bulletobj.style.visibility="hidden"}
}
}
}

if (document.all || document.getElementById)
document.write(bulletimg)

if (window.addEventListener)
window.addEventListener("load", modifylinks, false)
else if (window.attachEvent)
window.attachEvent("onload", modifylinks)
else if (document.getElementById || document.all)
window.onload=modifylinks

</script>
</head>
<body>
<a href="scops.html" class="ddbullet xlink" STYLE="text-decoration: none" target="B">S.C.O.P.s</a>
</body>

Thanks for the help so far.
Twey
08-23-2006, 04:37 PM
Change this line:
if (document.links[i].className=="ddbullet"){to:
if (document.links[i].className.indexOf("ddbullet") !== -1){
MTD
08-23-2006, 04:45 PM
That change in code fixed it. Thanks!
Twey
08-23-2006, 04:46 PM
See how much faster we could've solved that if you'd provided the code in the first place?
MTD
08-23-2006, 04:53 PM
Yea, sorry about that.