Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Dec 2008
    Posts
    58
    Thanks
    18
    Thanked 1 Time in 1 Post

    Dynamic styles help

    Here is the page in question:
    http://lawlocaust.freezoka.com/members/tot/
    (What you need to be looking at is the left side menu that says "In-game Info")

    Here is the javascript (Providing this seperately because I have it externally linked on the page):
    Code:
    var xmlDoc;
    
    if (window.ActiveXObject) {
    	xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
    }
    
    else if (document.implementation.createDocument) {
    	xmlDoc = document.implementation.createDocument("","",null);
    }
    
    else {
    	alert('Your browser does not support XML');
    }
    
    xmlDoc.async = false;
    xmlDoc.load("igi.xml");
    var x = xmlDoc.getElementsByTagName("GAME");
    var i;
    
    function post() {
    	document.getElementById("game").innerHTML = (x[i].getElementsByTagName("NAME")[0].childNodes[0].nodeValue);
    	document.getElementById("server").innerHTML = (x[i].getElementsByTagName("SERVER")[0].childNodes[0].nodeValue);
    	document.getElementById("ign").innerHTML = (x[i].getElementsByTagName("IGN")[0].childNodes[0].nodeValue);
    	document.getElementById("class").innerHTML = (x[i].getElementsByTagName("CLASS")[0].childNodes[0].nodeValue);
    	document.getElementById("lvl").innerHTML = (x[i].getElementsByTagName("LEVEL")[0].childNodes[0].nodeValue);
    	document.getElementById("rank").innerHTML = (x[i].getElementsByTagName("RANK")[0].childNodes[0].nodeValue);
    	document.getElementById("status").innerHTML = (x[i].getElementsByTagName("STATUS")[0].childNodes[0].nodeValue);
    }
    
    function ca() {
    	i = 0;
    	post();
    }
    
    function ms() {
    	i = 1;
    	post();
    }
    
    function pw() {
    	i = 2;
    	post();
    }
    
    function ao() {
    	i = 3;
    	post();
    }
    That is all you should need to know to help me with my problem.
    Note: I don't care if it's messy, I don't care if it's not the best way to do what I'm doing, I don't care if I'm using way more code than I need to be using. It works, and I wrote the entire code myself so I'm proud of it. Whereas I typically enjoy receiving criticism that would further my understanding of Javascript, at this time I would really only like to get comments that help me with my problem.

    Now, that being said...

    PROBLEM!
    What I have now works fine, yes. But I was trying to add something onto it. Right now, I have the links as #c0c0c0 (It's a moderate gray colour), and when you hover them, they become black. Previously, I was using a:active to make the links stay black when you clicked them (so navigators would know which choice they are on, obviously). However, as most of you probably know, this will stop working as soon as they click anywhere else.

    So I turned to javascript to fix my problem. When I took on the task, I was fairly confident I knew how to achieve what I wanted. Here is the basic idea of what I tried:
    Code:
    function ca(from,to) {
                document.from = to;
    	i = 0;
    	post();
    }
    Code:
    <a href="#" onclick="ca(this.style.color,#000000)">Combat Arms</a>
    However, that worked to no avail.

    I have a few theories which I did not test first. I thought that perhaps the #000000 needed to be in single quotes, such as:
    Code:
    <a href="#" onclick="ca(this.style.color,'#000000')">Combat Arms</a>
    Also, my other theory was that it wasn't turning the text black because in my CSS, I specifically tell the links to be gray. And, if I recall correctly, when formatting a webpage, browsers always use external sheets, internal sheets, embedded sheets, and lastly inline sheets in that order. I didn't know if that mattered or not, just a theory.

    So, my colleagues, after reading that hefty post, if anyone could provide any kind of help, it would be most appreciated.

  • #2
    Senior Coder rangana's Avatar
    Join Date
    Feb 2008
    Location
    Cebu City, Philippines
    Posts
    1,752
    Thanks
    65
    Thanked 372 Times in 365 Posts
    Why are you referencing the form? I thought you want to change the color of the link.

    I might be at mistake, but:
    Code:
    <a href="#" onclick="this.style.color='#000000'">Combat Arms</a>
    Learn how to javascript at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph

  • #3
    New Coder
    Join Date
    Dec 2008
    Posts
    58
    Thanks
    18
    Thanked 1 Time in 1 Post
    Quote Originally Posted by rangana View Post
    Why are you referencing the form? I thought you want to change the color of the link.

    I might be at mistake, but:
    Code:
    <a href="#" onclick="this.style.color='#000000'">Combat Arms</a>
    I'm not sure I understand what you're talking about. o.o;
    There isn't a single form on that entire page, so I'm a little bit confused as to what you mean.

    Plus, what you're suggesting would only change the color (if that would even work, I didn't try it).
    I need it to do a few things. I want it to turn the link black, but it still has to do the function "ca" when it is clicked.

  • #4
    Senior Coder rangana's Avatar
    Join Date
    Feb 2008
    Location
    Cebu City, Philippines
    Posts
    1,752
    Thanks
    65
    Thanked 372 Times in 365 Posts
    Quote Originally Posted by TheTot View Post
    I'm not sure I understand what you're talking about. o.o;
    There isn't a single form on that entire page, so I'm a little bit confused as to what you mean.
    My bad, I thought you typed document.form, what you had was document.from.

    Anyway, what you're doing is a bit wrong.

    Change this part:
    Code:
    <a href="#" onclick="ca(this.style.color,#000000)">Combat Arms</a>
    ...into:
    Code:
    <a href="#" onclick="ca(this,'#000000')">Combat Arms</a>
    ....and change this part:
    Code:
    function ca(from,to) {
                document.from = to;
    	i = 0;
    	post();
    }

    ...into:
    Code:
    function ca(from,to) {
    from.style.color=to;
    	i = 0;
    	post();
    Hope that helps.
    Learn how to javascript at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph

  • Users who have thanked rangana for this post:

    TheTot (01-24-2009)

  • #5
    New Coder
    Join Date
    Dec 2008
    Posts
    58
    Thanks
    18
    Thanked 1 Time in 1 Post
    Thanks, that worked fabulously!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •