SitePoint Sponsor

User Tag List

Results 1 to 15 of 15

Hybrid View

  1. #1
    SitePoint Enthusiast emcgill's Avatar
    Join Date
    Jul 1999
    Location
    Michigan, USA
    Posts
    62
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello,

    I am trying to make one of my pages have windows that pop up when the user clicks on something. I have a list of things, and I would like them to be able to click a little image (a question mark) next to it...and have the help file pop up defining that particular thing.

    I have figured out that I obvously have to use Javascript for this, because I want to customize the pop up window to not have the menu items or browsing buttons.

    I have also figured how to do this with one link...but how do I put 36 clickable question marks on a page?

    I am confused about the script that I have to put in the <heading> </heading> parts.

    I know the links....just what the heck do I put in the heading?

    Thank you,


    Eric McGill
    http://www.fivemiledesign.com

  2. #2
    Serial Publisher silver trophy aspen's Avatar
    Join Date
    Aug 1999
    Location
    East Lansing, MI USA
    Posts
    12,939
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    in the head do this:

    Code:
    <script language = "javascript">
    function popup(url){
    window.open(url,'helpwindow','width=400,height=170');
    
    }
    </script>
    Then your links would look like this:

    <a href ="javascript:popup('http://www.yahoo.com')">blah blah</a>
    Chris Beasley - I publish content and ecommerce sites.
    Featured Article: Free Comprehensive SEO Guide
    My Guide to Building a Successful Website
    My Blog|My Webmaster Forums

  3. #3
    Bimbo With A Brain! silver trophy Saz's Avatar
    Join Date
    Mar 2001
    Location
    Kent, United Kingdom
    Posts
    5,275
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is the script I use for pop-ups and it's placed in the <Head> section of the html.

    <SCRIPT LANGUAGE="JavaScript">
    function openWindow1(url_param) {

    var popupWin = null;
    popupWin = window.open(url_param, 'remote', 'width=400,height=375,resizable=no,menubar=no,toolbar=no,left=10,top=10,scrollbars=yes')
    popupWin.opener.name="main";
    popupWin.focus();
    }
    </SCRIPT>

    You can adjust the size of the window according to your requirements quite easily. The 'left=10, top=10' bit will place the pop-up 10 pixels in from the top left of the screen.

    To have several links on one page open this pop up is easy too........

    <a href="javascript:openWindow1('your_page.html')"><img border="0" src="images/image.gif" width="10" height="10"></a>

    Just insert 'javascript:openWindow1' before a standard link and put the link itself in brackets as shown here. You do this for each of the links on your page.

    If you need different sized windows, that can be done too by adding additional scripts 'openWindow2' etc with the different parameters set for each one. Word of warning though. I run Windows ME (husband's choice, not mine!) and for some reason, if a pop-up is already open when the link is clicked, the new link will open in the existing pop-up, even if you tell it to open in a different one of a different size. This is fine if your users close each pop-up in turn, but not all do. I've got round this for the time being by telling the pop-ups to close 'onBlur'. This will also save Win95/98 users from closing down your main window and finding hundreds of pop-ups to close too!!

    Hope this helps a bit, but I'm still new to the Java thing myself. Maybe some of the advisors here have a better way to do this?


    Saz
    Last edited by Saz249; Mar 29, 2001 at 14:48.

  4. #4
    SitePoint Enthusiast emcgill's Avatar
    Join Date
    Jul 1999
    Location
    Michigan, USA
    Posts
    62
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello,

    Thank you for your reply. I am still unable to get this to work though! Do you think you could take a look at my code?

    http://www.fivemiledesign.com/hosting/plans/test.htm

    I cut out the image part, so I just have a little question mark there. Click on it, and it says page not found. I do have the "yourpage.html" uploaded...and it is in the same directory as the "test.htm" page.

    Please have a look at the code. I copied and pasted straight from your code from here, and then I also printed your code off and typed it in myself (and that is where I stand right now).

    Thank you very much,


    Eric McGill
    http://www.fivemiledesign.com

  5. #5
    SitePoint Enthusiast emcgill's Avatar
    Join Date
    Jul 1999
    Location
    Michigan, USA
    Posts
    62
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    and by they way, I am asking both of you

  6. #6
    Bimbo With A Brain! silver trophy Saz's Avatar
    Join Date
    Mar 2001
    Location
    Kent, United Kingdom
    Posts
    5,275
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Eric,

    Just to let you know....

    I saved your test page to my desktop and made the same changes to your source code that I told you to make in the PM I sent you and it worked.

    Javascript's not hard....you just have to watch your spelling!

    Saz

    PS. The bit about removing the space between 'java' and 'script' in the hyperlink - I'm still confused how it ended up like that in the code I gave you as I copied and pasted it straight from my website.

    Hmmmn.....Any SitePointers out there know why a space was automatically inserted there?
    Saz: Naturally Blonde, Naturally Dizzy!
    No longer Editor of the Community Crier.

    Don't mind me, I'm having a BLONDE moment!

  7. #7
    SitePoint Enthusiast emcgill's Avatar
    Join Date
    Jul 1999
    Location
    Michigan, USA
    Posts
    62
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello,

    Yes, I now have it working....

    That space between the Java and Script was what was screwing me up everytime.

    Thank you very much. Maybe I'll send you the page that I am doing this on when I get it finished!


    Eric McGill
    http://www.fivemiledesign.com

  8. #8
    Bimbo With A Brain! silver trophy Saz's Avatar
    Join Date
    Mar 2001
    Location
    Kent, United Kingdom
    Posts
    5,275
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm glad you got it sorted Eric. Let me know when you've finished what you're doing.....I'll be interested to see it!

  9. #9
    SitePoint Enthusiast emcgill's Avatar
    Join Date
    Jul 1999
    Location
    Michigan, USA
    Posts
    62
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here is the finished page. I pretty much just set up the "help" type page.

    http://www.fivemiledesign.com/hostin...mparision.html

    Thanks again for all your help.


    Eric McGill
    http://www.fivemiledesign.com

  10. #10
    Bimbo With A Brain! silver trophy Saz's Avatar
    Join Date
    Mar 2001
    Location
    Kent, United Kingdom
    Posts
    5,275
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey, it looks good Eric. Glad I was able to help you.
    Saz: Naturally Blonde, Naturally Dizzy!
    No longer Editor of the Community Crier.

    Don't mind me, I'm having a BLONDE moment!

  11. #11
    SitePoint Addict djh's Avatar
    Join Date
    Apr 2000
    Location
    Long Beach, CA
    Posts
    333
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    kinda related:

    anyone know how to popup a window after the main body has loaded? I've seen it done, but am needing some code...

    thanks -

  12. #12
    Bimbo With A Brain! silver trophy Saz's Avatar
    Join Date
    Mar 2001
    Location
    Kent, United Kingdom
    Posts
    5,275
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can use the same code as shown above, then insert the onload command into the body of the html for that page...

    <body onload="javascript:openWindow1('your_page.htm')">


    This should work, if it doesn't let me know.

    By the way, watch out how you copy the code......
    For some reason, this forum always puts a space between 'java' and 'script'. This should be written as one word or the code won't work.
    Last edited by Saz249; Apr 9, 2001 at 13:40.
    Saz: Naturally Blonde, Naturally Dizzy!
    No longer Editor of the Community Crier.

    Don't mind me, I'm having a BLONDE moment!

  13. #13
    SitePoint Addict djh's Avatar
    Join Date
    Apr 2000
    Location
    Long Beach, CA
    Posts
    333
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks for that.

    have you tried using the bracketed "[code]" to separate your code?

    Code:
    javascript dave

  14. #14
    SitePoint Addict djh's Avatar
    Join Date
    Apr 2000
    Location
    Long Beach, CA
    Posts
    333
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CHANGE WINDOW FOCUS

    One other thing:

    how does the javascript go to change the focus back to the main windows?

    so, I want to load a popup (using onLoad=xxx), and then make the main browser window come up to the top (which I guess would mean the popup would go to the back).

    Ideas?

  15. #15
    I believe you have my stapler. scrubz's Avatar
    Join Date
    Feb 2001
    Location
    Van down by the river
    Posts
    254
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Use this in the popup window:

    <script language="JavaScript">
    <!--
    window.opener.focus();
    // -->
    </script>


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
  •