Results 1 to 4 of 4

Thread: JS files - where do they go? Collapsing/expanding content

  1. #1
    Ian Shere
    Guest

    Default JS files - where do they go? Collapsing/expanding content

    I am trying to make a FAQ's page using expanding and collapsing content (as
    I've said before, I'm a real dabbler and only the availability of products
    like NOF allow me to produce sites that look as if I know what I'm doing!!).
    I have seen many, many options for cut and paste but they nearly all have
    *.js files with them. Where should I put these under the NOF10 folder
    system?

    Also, if someone has a (as near as can be) foolproof version of the
    collapsing/expanding content, please please share a link! Chuck had a good
    one on beyondfusion.com but I'd like mine to allow only one FAQ open at a
    time (ie. auto close).

    TIA

    Ian


  2. #2
    Nancy O
    Guest

    Default Re: JS files - where do they go? Collapsing/expanding content

    These Accordion Panels from Dynamic Drive use the jQuery library and the
    accordion panel JavaScript.

    http://www.dynamicdrive.com/dynamici...daccordion.htm

    1) Download both js and jquery library files, then upload to your remote
    server, same folder as where your FAQ page will reside. If you publish by
    asset type (default), put them in your html folder. If you publish flat,
    put them in your site's root folder. Use a 3rd party ftp ware like Cute or
    WS_ftp pro for this.

    It is highly recommended that you make a test site to see if this works
    before bringing it into your main site.

    2) Click somewhere inside your MasterBorder or Page Layout area. On the
    properties box (F3), hit the HTML button. Screenshot -
    http://alt-web.com/Tutorials/Images/...tml_button.gif

    3) Click the Between Head Tabs. Screenshot
    http://alt-web.com/Tutorials/Images/PasteCode.gif

    4) Copy and Paste the first snippet of dynamic drive code WITHOUT the <!doc
    type info...> because this is created for you by NOF.

    --------------Omit this:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd"> <html
    xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    -----------------------

    5) Follow the rest of the instructions given on the DD site. HTML Body code
    should go in the Between Body Tabs as in Step 3 above or you could paste the
    html inside a text box with Ctrl+T.

    6) If you get lost, familiarize yourself with html, CSS and javascripts
    here: www.w3school.com
    More info on the power of JQuery here: http://jquery.com/

    HTH,
    Nancy O.
    www.alt-web.com/Tutorials/
    NOF Tips & Tutorials



  3. #3
    Ian Shere
    Guest

    Default Re: JS files - where do they go? Collapsing/expanding content

    Thanks Nancy. Clear instructions but, alas, it doesn't work. No idea
    what's wrong but I am very frustrated with it (have been trying to get this
    working for 5 days now). I havea script from Chuck at BeyondFusion. Only
    thing it doesn't do is auto collapse but I'm thinking I'll just live with
    that. At least it's working!

    I have been publishing locally and using XAMPP which works beautifully for
    everything else. I don't suppose my publishing all my pages as PHP would
    stop the collapsing working? I have a little revolving quote PHP script
    that is in the MasterBorder that needs me to do this. Otherwise I am just
    cutting and pasting. All the info displays, but it displays like I have JS
    turned off (which I don't) and part of the script is recognising this and
    expanding all the FAQs. So I get a page of Questions with expanded answers
    and cannot collapse anything. Clicking Expand All or Collapse All works
    like a Back to Top link. Otherwise no action.

    Cheers

    Ian

    "Nancy O" <nancyoshea1@NOSPAMatt.net> wrote in message
    news:g2ulg0$4515@flsun90netnews01.netobjects.com.. .
    > These Accordion Panels from Dynamic Drive use the jQuery library and the
    > accordion panel JavaScript.
    >
    > http://www.dynamicdrive.com/dynamici...daccordion.htm
    >
    > 1) Download both js and jquery library files, then upload to your remote
    > server, same folder as where your FAQ page will reside. If you publish by
    > asset type (default), put them in your html folder. If you publish flat,
    > put them in your site's root folder. Use a 3rd party ftp ware like Cute
    > or
    > WS_ftp pro for this.
    >
    > It is highly recommended that you make a test site to see if this works
    > before bringing it into your main site.
    >
    > 2) Click somewhere inside your MasterBorder or Page Layout area. On the
    > properties box (F3), hit the HTML button. Screenshot -
    > http://alt-web.com/Tutorials/Images/...tml_button.gif
    >
    > 3) Click the Between Head Tabs. Screenshot
    > http://alt-web.com/Tutorials/Images/PasteCode.gif
    >
    > 4) Copy and Paste the first snippet of dynamic drive code WITHOUT the
    > <!doc
    > type info...> because this is created for you by NOF.
    >
    > --------------Omit this:
    > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    > "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd"> <html
    > xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    > -----------------------
    >
    > 5) Follow the rest of the instructions given on the DD site. HTML Body
    > code
    > should go in the Between Body Tabs as in Step 3 above or you could paste
    > the
    > html inside a text box with Ctrl+T.
    >
    > 6) If you get lost, familiarize yourself with html, CSS and javascripts
    > here: www.w3school.com
    > More info on the power of JQuery here: http://jquery.com/
    >
    > HTH,
    > Nancy O.
    > www.alt-web.com/Tutorials/
    > NOF Tips & Tutorials
    >
    >



  4. #4
    Nancy O
    Guest

    Default Re: JS files - where do they go? Collapsing/expanding content

    Ian,
    Here in the States, it's Friday the 13th. Some things should never be tried
    or tested on Friday the 13th!!

    Cheers,
    --N

    "Ian Shere" <ian@tarzandesign.co.nz> wrote in message
    news:g2up14$5jd1@flsun90netnews01.netobjects.com.. .
    > Thanks Nancy. Clear instructions but, alas, it doesn't work. No idea
    > what's wrong but I am very frustrated with it (have been trying to get

    this
    > working for 5 days now). I havea script from Chuck at BeyondFusion. Only
    > thing it doesn't do is auto collapse but I'm thinking I'll just live with
    > that. At least it's working!
    >
    > I have been publishing locally and using XAMPP which works beautifully for
    > everything else. I don't suppose my publishing all my pages as PHP would
    > stop the collapsing working? I have a little revolving quote PHP script
    > that is in the MasterBorder that needs me to do this. Otherwise I am just
    > cutting and pasting. All the info displays, but it displays like I have

    JS
    > turned off (which I don't) and part of the script is recognising this and
    > expanding all the FAQs. So I get a page of Questions with expanded

    answers
    > and cannot collapse anything. Clicking Expand All or Collapse All works
    > like a Back to Top link. Otherwise no action.
    >
    > Cheers
    >
    > Ian
    >
    > "Nancy O" <nancyoshea1@NOSPAMatt.net> wrote in message
    > news:g2ulg0$4515@flsun90netnews01.netobjects.com.. .
    > > These Accordion Panels from Dynamic Drive use the jQuery library and the
    > > accordion panel JavaScript.
    > >
    > > http://www.dynamicdrive.com/dynamici...daccordion.htm
    > >
    > > 1) Download both js and jquery library files, then upload to your remote
    > > server, same folder as where your FAQ page will reside. If you publish

    by
    > > asset type (default), put them in your html folder. If you publish

    flat,
    > > put them in your site's root folder. Use a 3rd party ftp ware like Cute
    > > or
    > > WS_ftp pro for this.
    > >
    > > It is highly recommended that you make a test site to see if this works
    > > before bringing it into your main site.
    > >
    > > 2) Click somewhere inside your MasterBorder or Page Layout area. On the
    > > properties box (F3), hit the HTML button. Screenshot -
    > > http://alt-web.com/Tutorials/Images/...tml_button.gif
    > >
    > > 3) Click the Between Head Tabs. Screenshot
    > > http://alt-web.com/Tutorials/Images/PasteCode.gif
    > >
    > > 4) Copy and Paste the first snippet of dynamic drive code WITHOUT the
    > > <!doc
    > > type info...> because this is created for you by NOF.
    > >
    > > --------------Omit this:
    > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    > > "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd"> <html
    > > xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    > > -----------------------
    > >
    > > 5) Follow the rest of the instructions given on the DD site. HTML Body
    > > code
    > > should go in the Between Body Tabs as in Step 3 above or you could paste
    > > the
    > > html inside a text box with Ctrl+T.
    > >
    > > 6) If you get lost, familiarize yourself with html, CSS and javascripts
    > > here: www.w3school.com
    > > More info on the power of JQuery here: http://jquery.com/
    > >
    > > HTH,
    > > Nancy O.
    > > www.alt-web.com/Tutorials/
    > > NOF Tips & Tutorials
    > >
    > >

    >




Posting Permissions

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