Results 1 to 7 of 7

Thread: Pop-it Menu help with popup windows in links

  1. #1
    Join Date
    Feb 2006
    Posts
    236
    Thanks
    8
    Thanked 3 Times in 3 Posts

    Default Pop-it Menu help with popup windows in links

    Hi, I hate to bother you hard working expert guys, but I need help. I need to use the DD Pop-it Menu found at http://www.dynamicdrive.com/dynamicindex1/popit.htm, which works great in combination with the DD Floating Menu Script found at http://www.dynamicdrive.com/dynamici...staticmenu.htm. I have gotten the Pop-it Menu to look very similar to the Floating Menu by adding tags inside the array (see below). But, I have a problem, one major and one minor that I need help with. The major issue is that the links in the Pop-it Menu are movie files (.avi) and I want to use a pop-up window so the user can keep reading while the movie(s) load(s). Well, I have some short old code for a pop-up window that I got from my son and I'm using this function elsewhere on the page, also with no problem. But, when I use the popup window call inside the Pop-it Menu links, I think the reference to the onClick of the Popup window is incorrect, and it doesn't function, instead acting like an ordinary link opening new content (actually replacing the main page.) The popup window code I'm using is this:

    <!--
    function popup(mylink, windowname)
    {
    if (! window.focus)return true;
    var href;
    if (typeof(mylink) == 'string')
    href=mylink;
    else
    href=mylink.href;
    window.open(href,windowname,'width=350,height=290,left=350,top=250,resizable=yes');
    return false;
    }
    //-->

    and the call that works outside of the Pop-it Menu is this:

    <p class="p2"><a href="http://earth.engr.ccny.cuny.edu/noaa/wc/IMGP1662.mov" onClick="return popup(this, 'indexpopup')">Movie of the MFR-7 Shadowband Radiometer in operation.</a></p>

    and the call that doesn't work because of (I think) the onClick event, when used inside of the Pop-up Menu Script, is this:

    var linkset=new Array()

    linkset[0]='<font style class="mhd">'
    linkset[0]+='&nbsp;TOTAL SKY MOVIES&nbsp;&nbsp;'
    linkset[0]+='</font>'
    //linkset[0]+='<hr>' //Optional Separator
    linkset[0]+='<font style class="mlk">'
    linkset[0]+='<a href="http://earth.engr.ccny.cuny.edu/noaa/wc/TSIData/050426.avi" onClick="return popup(this, "indexpopup")">26-Apr-2005 14.5M</a>'
    ... etc.

    I've tried changing 'this' to 'main' and 'menuobj' with no change, still overwrites the window.

    The second minor problem is trying to get the background color of the the menu headers to look alike. The color doesn't fill the Popit Menu correctly leaving white space on the right header, and I'll link to a site when I get a working popup window mod to post.

  2. #2
    Join Date
    Feb 2006
    Posts
    236
    Thanks
    8
    Thanked 3 Times in 3 Posts

    Smile It Works, All It Works!

    Hey guys, OK, I fixed it all. And I'm really impressed on how all the DD script pieces can work together in harmony. A great way to finish the week! http://www.dynamicdrive.com/forums/i...lies/smile.gif
    I hope that someone in the future will benefit from my assembly.

    1. I scrapped the popup function that I was using and substituted the one from DD Popup Window generator at http://www.dynamicdrive.com/dynamicindex8/popwin.htm.

    2. The generated code was this:

    <a href="http://earth.engr.ccny.cuny.edu/noaa/wc/TSIData/05" onclick="NewWindow(this.href,'tsipopup','320','450','no','center');return false" onfocus="this.blur()">YourLinkText</a>

    Then I took this link code (which, BTW, was too short and truncated the link, so I edited it by hand. Someone should update this generator to fix the length issue, but it's not critical.) and imbeded it into the linkset array of the DD Popit Menu script found at http://www.dynamicdrive.com/dynamicindex1/popit.htm.

    The key was to use the 'escape' character in the string because of the multiple quotes. ( just thought it would be worth a try from my Perl past.) I added the \ before each embeded ' inside the beginning and ending single quotes. So the modified linkset array in the Popit Menu became:

    /***********************************************
    * Pop-it menu- © Dynamic Drive (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit http://www.dynamicdrive.com/ for full source code
    ***********************************************/

    var defaultMenuWidth="206px" //set default menu width.

    var linkset=new Array()

    linkset[0]='<font style class="mhd">'
    linkset[0]+='&nbsp;TOTAL SKY IMAGER MOVIES&nbsp;&nbsp;'
    linkset[0]+='</font>'
    //linkset[0]+='<hr>' //Optional Separator
    linkset[0]+='<font style class="mlk">'
    linkset[0]+='<a href="http://earth.engr.ccny.cuny.edu/noaa/wc/TSIData/050426.avi" onclick="NewWindow(this.href,\'tsipopup\',\'320\',\'450\',\'no\',\'center\');return false" onfocus="this.blur()">26-Apr-2005 14.5M</a>'
    ~~~
    snip
    ~~~
    linkset[0]+='</font>'

    This popup window works from the popit menu in all the browses that I tested.

  3. #3
    Join Date
    Feb 2006
    Posts
    236
    Thanks
    8
    Thanked 3 Times in 3 Posts

    Question I still need cosmetic help with DD Popit Menu

    Script: DD Popit Menu
    http://www.dynamicdrive.com/dynamicindex1/popit.htm and
    Script: DD FLoating Menu
    http://www.dynamicdrive.com/dynamici...staticmenu.htm

    Ah, I'm not quite finished and I need your help because I can't fix this cosmetic problem. I need to make this Popit Menu look like my main menu, the DD Floating Menu. I can't color the background of the Popit Menu to fill completely like the Floating menu does. I applied a css to both and the background color only applies to the text and extra &nbsp. The code that I'm using to try to color it is in the last post (see linkset array) and the piece of the css sheet that applies to both is below. What can I do? Mad Professor, I'd really, really appreciate your help with this last little bit.

    .mhd { /* menu header lines */
    font-family: Verdana;
    font-size: 10pt;
    line-height: 12pt;
    letter-spacing: 0;
    text-align: left;
    word-spacing: normal;
    text-decoration: none;
    color: #fff;
    background-color: #808000; }

  4. #4
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Change the background-color in the #popitmenu block of the stylesheet.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends français | entiendo español | tôi ít hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  5. #5
    Join Date
    Feb 2006
    Posts
    236
    Thanks
    8
    Thanked 3 Times in 3 Posts

    Default

    Thanks Twey, but I already tried that in the css statement, and it has problems. What I want to achieve, is to match the design in the Floating Menu Script. There, two separate declarations are used, and I have taken this from the DD Floating Menu Script and maybe changed it a bit, but used it in both places. I had to use <font style class="mhd" because <p> and <div> make the Popit Menu title bar go whacky by white space padding above and below the title, and never could get background-color defined within the title without this. Is there another way to get it to work? You can see the best I have so far at: http://earth.engr.ccny.cuny.edu/noaa...ex31USA.html#8 then scrolling down to Sky Image Movies where the DD Popit Menu in invoked on mouseover. Other video format issues just came up when people were testing my work (ug, ugggg and Oh ___!), and I posted about that on the graphics forum. I'm hoping your fantastic insight will prevail.

    .mhd { /* menu header lines */
    font-family: Verdana;
    font-size: 10pt;
    line-height: 12pt;
    letter-spacing: 0;
    text-align: left;
    word-spacing: normal;
    text-decoration: none;
    color: #fff;
    background-color: #808000; }
    .mlk { /* menu link lines */
    font-family: Verdana;
    font-size: 8pt;
    line-height: 10pt;
    letter-spacing: 0;
    text-align: left;
    text-decoration: none;
    margin-left: 10px;
    word-spacing: normal;
    color: #808080; /* this is ignored as it is overwritten by the active link */
    background-color: #fff;
    }

  6. #6
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    I'm hoping your fantastic insight will prevail.
    I'm hoping that's sarcasm.
    but I already tried that in the css statement, and it has problems.
    What problems, exactly? Changing #popitmenu's background-color did the trick for me; you did only want to change the colour of the heading, right?
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends français | entiendo español | tôi ít hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  7. #7
    Join Date
    Feb 2006
    Posts
    236
    Thanks
    8
    Thanked 3 Times in 3 Posts

    Thumbs up

    Yep, it worked for me too. I sure don't know what I was doing wrong when I went through that, but all is OK with the code now. Thanky, Twey for your insight, it was definately better that mine.

    Now to figure out the avi format issues.......

Bookmarks

Posting Permissions

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