JavaScript in a Page?


#1

Hi,

I would like to insert some javascript commands to navigate among a set
of images. I am thinking of constructing an array of image files, for
instance:

Later within the body, I would change between images using -

«  
»

The array Panel1 is page-specific, so I cannot insert it into a Layout
section.
I am not sure if I can insert this within a Page.

Any help and tips would be much appreciated.

Thanks,
saji


Saji N. Hameed

APEC Climate Center +82 51 668 7470
National Pension Corporation Busan Building 12F
Yeonsan 2-dong, Yeonje-gu, BUSAN 611705 removed_email_address@domain.invalid
KOREA


#2

In a site that I am building, I have a similar requirement. There are
standard, site-wide css and javascript files that are included in my
layout but I also have page specific javascript or css that occasionally
needs added to the section.

I solve it by including the following in my layout:

... ... ...

Then, in the appropriate pages, I create a new page part named “css” or
“js” and put in my code in there.

The cool thing about this method is that I can declare inline javascript
or css like:

#mainPic {display:none}

or I can include an external file like:

-Chris


#3

Hi -

Thanks for the useful information about how to add JavaScript to a page.

I know it’s not quite on the topic of RoR, but I need a little bit of
help with my JavaScript.

My HTML is as follows:

  • <a href="http://www.spongenewmedia.co.uk/" title="Return to the home page"Welcome
  • Blog
  • Contact

What I want to do is apply the class “selected” to certain links using
JavaScript. The purpose of this is to show waht page you are currently
on.

The JavaScript I currently have is this:

However, this only applys the class of “selected” to the

  • item. How
    to use the getElementById function to select the actual hyperlink?

    Many thanks in advance!


  • #4

    thanks a lot, Chris. this will allow me to replace images using
    buttons in a page i am using, instead of putting one page per image.
    saji


    #5

    Hi Oliver,

    You have two typical options in this case. The first is to give your
    element an id, just like you did for the

  • element. Then you
    could use that id in your javascript. The other method, though, is
    probably what you want. You could keep your html and javascript the
    way it is, and modify your css (I assume you’re using css). So
    instead of your css looking like
  • .selected {
    #some styles
    }

    you could have

    .selected a {
    # some styles for hyperlink
    }

    This way your styling the hyperlink inside of an element with
    className “selected”

    Hope that helps,
    Matt