Javascript + css tooltip (problem with DOMs)

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • frerejacques
    New Member
    • Jun 2007
    • 2

    Javascript + css tooltip (problem with DOMs)

    Hi,

    I've encoutered a problem with javascript. I can read and edit basic java. however I'm working on with a free script that I found on the internet and encountered a problem.

    First I'll explain the structure of the site.

    main.htm has an empty DIV called 'contentDIV'
    clicking on the 'design graphique' calls a javascript to load an external .htm into that specific DIV.

    inside that DIV I'll have imgs of my portfolio. I want to have custom-CSS roll-over tooltips for those images. The tooltip is replaced by a DIV called qTIP.

    So it's

    HTML
    -BODY
    - - DIV (id=contentDIV)
    - - - IMG
    - - - DIV (qTip, this is the rollover)


    However, I'm having trouble figuring out the coding for DOM-levels. The script was created for use of IMGs on the main BODY. but since my IMGs are located inside a DIV and not on the root document, i can't figure out how to modify the script to look inside contentDIV for the nodes to read and etc.

    here's my web site :

    frerejacques.ca is your first and best source for information about frerejacques. Here you will also find topics relating to issues of general interest. We hope you find what you are looking for!


    here's a working example with everything located on the root BODY :



    here's the javascript file :

    frerejacques.ca is your first and best source for information about frerejacques. Here you will also find topics relating to issues of general interest. We hope you find what you are looking for!


    I tried contacting the creator of the script but he hasnt responded at all.

    Thanks in advance if anybody can give me advice to this JS rookie.
  • acoder
    Recognized Expert MVP
    • Nov 2006
    • 16032

    #2
    Welcome to TSDN!

    Instead of [CODE=javascript]document.getEle mentsByTagName( "BODY")[/CODE] try [CODE=javascript]document.getEle mentById("conte ntDIV")[/CODE]

    Comment

    • frerejacques
      New Member
      • Jun 2007
      • 2

      #3
      Thanks for the suggestion. But still no luck.

      Here is a better example of what might be going wrong :



      i think its the fact that a script loads in the HTML content of an external site into the DIV that screws everything up. I think its acting as if the browser doesnt think those images exist at all. Check the Source once you click on "design graphique" and you'll see nothing changed.

      i tried forcing the external file to run the script however, it seems to ignore everything outside the BODY tag.

      any ideas?

      Comment

      • acoder
        Recognized Expert MVP
        • Nov 2006
        • 16032

        #4
        Originally posted by frerejacques
        Thanks for the suggestion. But still no luck.

        Here is a better example of what might be going wrong :

        http://frerejacques.ca/reboot8/index5.htm
        That link doesn't work, but when I checked the previous link, it seems to work?

        Originally posted by frerejacques
        i think its the fact that a script loads in the HTML content of an external site into the DIV that screws everything up. I think its acting as if the browser doesnt think those images exist at all. Check the Source once you click on "design graphique" and you'll see nothing changed.
        The reason why the source doesn't change is that you're using Ajax to load the content.

        Comment

        Working...