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 9 of 9
  1. #1
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Planet Earth Code Poet: True
    Posts
    282
    Thanks
    0
    Thanked 1 Time in 1 Post

    Control Style in Other Frame

    Ok, at work I have to use a gimpy content managemnt system. It generates most of the layout and allows you to do very little to customize the pages. In one instance they generate a menu with some horrid colors and font faces and it is always the same garbarge no matter what the rest of the pages look like I have control of a frame just bellow this one and want to change the style of the links in the ugly frame. Here is what I am trying:

    function doit(){
    var x=top.uglyFrame.document.getElementsByTagName('a');
    for(var i=0;i<x.length;i++){
    x[i].setAttribute("style","color:green; background-color:orange")
    }
    }

    the page in the ugly frame looks like this:

    <STYLE TYPE='text/css'>
    <!--
    A:link {
    color:#003399;
    text-decoration:none;
    font-weight:400;font-size:10pt;line-height:10pt;
    font-family:helvetica,arial,sans-serif;
    }
    A:visited {
    color:#003399;
    text-decoration:none;
    font-weight:400;font-size:10pt;line-height:10pt;
    font-family:helvetica,arial,sans-serif;
    }
    A:active {
    color:#003399;
    text-decoration:none;
    font-weight:400;font-size:10pt;line-height:10pt;
    font-family:helvetica,arial,sans-serif;
    }
    A.nav:link {
    color:#003399;
    text-decoration:none;
    background-color:#CCCC99;
    font-weight:400;font-size:10pt;line-height:10pt;
    font-family:helvetica,arial,sans-serif;
    }
    A.nav:visited {
    color:#003399;
    text-decoration:none;
    background-color:#CCCC99;
    font-weight:400;font-size:10pt;line-height:10pt;
    font-family:helvetica,arial,sans-serif;
    }
    A.nav:active {
    color:#003399;
    text-decoration:none;
    background-color:#CCCC99;
    font-weight:400;font-size:10pt;line-height:10pt;
    font-family:helvetica,arial,sans-serif;
    }
    .menu {
    color:#000000;
    text-decoration:none;
    background-color:#CCCCCC;
    font-weight:400;font-size:10pt;line-height:10pt;
    font-family:helvetica,arial,sans-serif;
    }
    -->
    </STYLE>
    <BODY BGCOLOR="#FFFFFF">
    <TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0"><TR><TD HEIGHT="2"></TD></TR></TABLE>
    <TABLE WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0"><TR><TD>
    <FONT CLASS="menu">ACTION MENU:</FONT>
    <A CLASS="nav" HREF="prev.php">Previous</A>
    <A CLASS="nav" HREF="next.php">Next</A>
    <A CLASS="nav" HREF="cont.php">Contents</A>
    <A CLASS="nav" HREF="retr.php">Retrace</A>
    <FORM NAME="titles_form">
    <INPUT TYPE="HIDDEN" NAME="courselogo_html" VALUE="Overriding the Course Logo">
    <INPUT TYPE="HIDDEN" NAME="myavatar_html" VALUE="Using an Avatar">
    <input type="button" onclick="doit()" value="test">
    </FORM>


    So I need to overwirte those styles in order to match the rest of the site. Keep in mind that I don't have any access to the ugly frame.

    Any ideas?

  • #2
    Senior Coder joh6nn's Avatar
    Join Date
    Jun 2002
    Location
    72° W. 48' 57" , 41° N. 32' 04"
    Posts
    1,887
    Thanks
    0
    Thanked 1 Time in 1 Post
    dunno. your way looks good, but newfangled. i'm more /old\-(fashioned|skool)/

    function doit(){
    var x = top.uglyFrame.document.links;
    for ( var i = 0; i < x.length; i++ ) {
    x[i].style.color = "green";
    x[i].style.backgroundColor = "orange";
    }
    }
    bluemood | devedge | devmo | MS Dev Library | WebMonkey | the Guide

    i am a loser geek, crazy with an evil streak,
    yes i do believe there is a violent thing inside of me.

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Planet Earth Code Poet: True
    Posts
    282
    Thanks
    0
    Thanked 1 Time in 1 Post
    Yeah, I tried that too. Neither worked out, I am thinking it is because the do not have a style attribute explicitly set in the first place.

    Any other ideas?

  • #4
    Senior Coder joh6nn's Avatar
    Join Date
    Jun 2002
    Location
    72° W. 48' 57" , 41° N. 32' 04"
    Posts
    1,887
    Thanks
    0
    Thanked 1 Time in 1 Post
    not true. try this here in the forum:

    javascript:x = document.links; for ( var i = 0; i < x.length; i++ ) { x[i].style.color = "green"; x[i].style.backgroundColor = "orange"; } void 0;
    bluemood | devedge | devmo | MS Dev Library | WebMonkey | the Guide

    i am a loser geek, crazy with an evil streak,
    yes i do believe there is a violent thing inside of me.

  • #5
    Senior Coder joh6nn's Avatar
    Join Date
    Jun 2002
    Location
    72° W. 48' 57" , 41° N. 32' 04"
    Posts
    1,887
    Thanks
    0
    Thanked 1 Time in 1 Post
    is it simply not working, or is it throwing an error? if so, what error?
    bluemood | devedge | devmo | MS Dev Library | WebMonkey | the Guide

    i am a loser geek, crazy with an evil streak,
    yes i do believe there is a violent thing inside of me.

  • #6
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Planet Earth Code Poet: True
    Posts
    282
    Thanks
    0
    Thanked 1 Time in 1 Post
    Cool, thanks to you I have made progress, this works out for the links:

    PHP Code:
    window.onload=function(){
      var 
    x=top.uglyFrame.document.links;
      for(var 
    i=0;i<x.length;i++){ 
        
    with(x[i].style){
          
    color="green";
          
    backgroundColor="orange";
          
    fontFamily="Times";
          
    fontSize="18pt";
        }
      } 

    But I still cant change the style of this bit:

    <FONT CLASS="menu">ACTION MENU:</FONT>

  • #7
    Senior Coder joh6nn's Avatar
    Join Date
    Jun 2002
    Location
    72° W. 48' 57" , 41° N. 32' 04"
    Posts
    1,887
    Thanks
    0
    Thanked 1 Time in 1 Post
    try setting className to "" first, and then playing with it.

    nice use of with(), by the way.
    Last edited by joh6nn; 09-03-2002 at 08:26 PM.
    bluemood | devedge | devmo | MS Dev Library | WebMonkey | the Guide

    i am a loser geek, crazy with an evil streak,
    yes i do believe there is a violent thing inside of me.

  • #8
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This might sound a bit brutal ... but you could write inside the font tag .. with another font tag, something like

    var fontText = fontTagObj.innerHTML;

    fontTagObj.innerHTML = '<font color=red>' + fontText + '</font>';



    btw - what's with() ? - i've never encountered that before

  • #9
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Planet Earth Code Poet: True
    Posts
    282
    Thanks
    0
    Thanked 1 Time in 1 Post
    Spot on! This is the final function:

    PHP Code:
    window.onload=function(){
    // Background color for action menu frame
      
    var doc=top.bottom_parent.main_win.button.document;
      
    doc.bgColor="#000092";

    // Style for action menu links
      
    var lnk=doc.links
      
    for(var i=0;i<lnk.length;i++){ 
        
    with(lnk[i].style){
          
    color="green";
          
    backgroundColor="orange";
          
    //fontFamily="Times";
          //fontSize="18pt";
        
    }
      } 

    // Style for action menu tab
      
    var fon=doc.getElementsByTagName('font'); 
      for(var 
    i=0;i<fon.length;i++){ 
        
    fon[i].className=""
        
    with(fon[i].style){
          
    //color="green";
          
    backgroundColor="orange";
          
    fontWeight="bold";
          
    fontFamily="Arial";
          
    fontSize="10pt";
        }
      }

    By the way the with() statement comes in hady in several situations, check this out:

    http://javascriptkit.com/javatutors/varshort4.shtml


  •  

    Posting Permissions

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