Sidebar Sidebar
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

Can I apply javascript behavior to stylesheet?

yojitani

yojitani

macrumors 68000
Original poster
Apr 28, 2005
1,858
10
An octopus's garden
What I want to do is set a behavior for a single div so that when a lesser (than me:p) admin enters a new link or sets of links within the div the link(s) will open in a new window with a specified size. Is this possible to do? How?

Thanks!
 
It sounds like you're saying you're using CSS to make sure the pop-up window size is set to what you want, but this isn't something CSS does. But I'm thinking that isn't what you're trying to ask.

If you want to control all links within a div you can do,

#divName a {
/* your CSS */
}

If I'm way off base be more descriptive on the setup of your problem/situation.
 
angelwatt said:
It sounds like you're saying you're using CSS to make sure the pop-up window size is set to what you want, but this isn't something CSS does. But I'm thinking that isn't what you're trying to ask.

If you want to control all links within a div you can do,

#divName a {
/* your CSS */
}

If I'm way off base be more descriptive on the setup of your problem/situation.
Click to expand...

No, I guess I didn't make myself clear. I was wondering if there was some way to get the javascript to apply to all links within the div. I'm not so well versed in javascript - I tend to rely on dreamweaver for this sort of thing - but I'm writing a site for people who don't know even basic html.

Actually, perhaps if I tell you exactly what I'm doing, you might be able to offer other suggestions. The page I'm working on is an 'events' page, basically. The client needs to add new events on regular basis. The listed events link to various event descriptions that are generated from 'webevent'. Those descriptions popup in smallish boxes on the webevent page. Now, they can link to the description in a regular window, but I was wanting to links that they write on the page I'm working on in the same way.

I'm not sure I can explain this any clearer. Here is an example webevent page: note how the events popup in another window. I want to link to the same place in a similar sized window.

YT
 
OK, I think I'm following now. Below is some JS that'll set the href of all links within the specified div element. I think this should set you in the right direction for what you want. This is a simplified version, but hopefully is useful. Just add a call to onInit from onload in the body tag (<body onload="onInit();">).

HTML: 
function onInit()
{
  theDiv = document.getElementById("ex");
  links = theDiv.getElementsByTagName("a");
  
  for (i=0; i < links.length; i++)
  {
    links[i].href = "#new";
  }
}
 
angelwatt said:
OK, I think I'm following now. Below is some JS that'll set the href of all links within the specified div element. I think this should set you in the right direction for what you want. This is a simplified version, but hopefully is useful. Just add a call to onInit from onload in the body tag (<body onload="onInit();">).

HTML: 
function onInit()
{
  theDiv = document.getElementById("ex");
  links = theDiv.getElementsByTagName("a");
  
  for (i=0; i < links.length; i++)
  {
    links[i].href = "#new";
  }
}
Click to expand...

OK. This took me awhile to work out and I realize that it is not quite what I am looking for. What I want is to induce the same behavior for all links within the div. In this case, the behavior i want is to open a popup. I want to be able to specify the link within the div, not in the JS.

I don't even know if this is possible...

Thanks a million for the help!!
 
yojitani said:
OK. This took me awhile to work out and I realize that it is not quite what I am looking for. What I want is to induce the same behavior for all links within the div. In this case, the behavior i want is to open a popup. I want to be able to specify the link within the div, not in the JS.

I don't even know if this is possible...

Thanks a million for the help!!
Click to expand...

The most obvious solution would be to not use Javascript at all, and just use target = "_blank".

Aside from that, you can use the Javascript supplied, but use your own code to change the links:
Code: 
var links;
function onInit () {
    /* First, we get the div */
    var theDiv = document.getElementById("ex");
    
    /* Now, we fill the links list (declared above) */
    links = theDiv.getElementsByTagName("a");
    
    /* Now, we loop through the links list */
    for (i=0; i < links.length; i++) {
        /* For each link:
            Make it call popup function (with link number) when it is clicked
            Store the old href somewhere. Since Javascript allows you to add
                a variable wherever, just make a property "oldHref"
            Set the href of the link to something that does nothing, so we are
                not bothered by what the link was originally supposed to do
                before we changed it.
        */

        links[i].onclick = "myShowPopup(" + i + ");";
        links[i].oldHref = links[i].href;
        links[i].href = "javascript:void(0);";
    }
}
function myShowPopup(i){
    var path = links[i].oldHref;
    /* Do whatever code you want to open a popup window to "path" */
}

While I would probably do it a more complicated way on my own website so I could add more later and make it more flexible (I am constantly changing things), this should do for most purposes.

I hope that helps!
 
You must log in or register to reply here.
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.
Top Bottom
Back