iframe load at bottom

Discussion in 'Web Design and Development' started by ghking, Oct 15, 2007.

  1. ghking macrumors regular

    ghking

    Joined:
    Jul 21, 2007
    #1
    Is there a way to get an iframe to load at the bottom? like load with it's scroll bar all the way down?

    And i cant change its code, just the main page's.

    thanks
     
  2. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #2
    As far as I'm aware JavaScript is the most reliable way to do it, though can be a pain to code as it takes browser specific code. Another option, though I've never tried it is to append an internal link to the iframe url for something at the bottom of the page.

    Example url: http://website/page.html#bottom
    Assuming there is some element at or near the bottom of the page with the id attribute equal to "bottom". Again, not sure if that'll work, but worth a try.
     
  3. ghking thread starter macrumors regular

    ghking

    Joined:
    Jul 21, 2007
    #3
    well this is all i have so far


    <iframe src="website" height="500" width="200" frameborder="0" scrolling="yes">
    </iframe>



    i have tried this if this is what you mean



    <iframe src="website#bottom" height="500" width="200" frameborder="0" scrolling="yes">
    </iframe>



    but it didnt work and I cant modify the iframe's url html so im kind of stuck.
     
  4. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #4
    Well #bottom will only work if there is a tag element at the website with an id of bottom. There isn't likely one by the way. Search the bottom area of the web site's HTML code and see if there are and id attributes you can make use of. If you can show the web site you're using in the iframe I can try to help out further.
     
  5. ghking thread starter macrumors regular

    ghking

    Joined:
    Jul 21, 2007
    #5
    its actually just a haloscan commenting window that i am trying to put in my site without having it open in a new window. heres the code.
     
  6. ghking thread starter macrumors regular

    ghking

    Joined:
    Jul 21, 2007
    #6
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <meta name="robots" content="index,nofollow,noarchive" />
    <title>HaloScan.com - Comments</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link href="http://www.haloscan.com/members/rss.php?user=xxxsinkemfastxxx" rel="alternate" title="Recent comments for xxxsinkemfastxxx" type="application/rss+xml" />
    <base target="_new" />
    <style type="text/css">
    <!--
    /* Cached bemanistyle-bstyle-comments.css */
    /*This Stylesheet Was Created For Bemanistyle.com*/ A { font-family : Verdana;
    font-size : 9px; text-decoration: none; color: #FFFFFF; font-weight : bold; }
    A:Hover { font : 9px Verdana; text-decoration : underline; color : #CCCCCC; background
    : Black; font-weight: bold; } body { margin : 20px ; background-color : #000000
    ; color : #ffffff ; font-family : verdana ; font-size : 9px ; scrollbar-3dlight-color
    : #000000; scrollbar-arrow-color : #FFFFFF; scrollbar-base-color : black; scrollbar-darkshadow-color
    : #000000; scrollbar-face-color : black; scrollbar-highlight-color : black; scrollbar-shadow-color
    : black; scrollbar-track-color : black; } table { font-size : 9px ; } textarea
    { font-size : 9px ; font-family : verdana ; color : #CCCCCC; border : 1px solid
    #666666 ; background-color : #000000; } input { font-size : 9px ; font-family:
    verdana ; color : #CCCCCC; border : 1px solid #666666 ; background-color : #000000
    ; } .MainTable {background-color: #000000;} .PSubmit {padding-left:110px;} .InputCell
    { border-top:1px outset #666666; text-align:center; font-family: Verdana, sans-serif;
    font-size:9px; padding: 9px; color: #CCCCCC; } .MessageCell { border-top: 1px
    outset #666666; text-align: ; font-family: Verdana, sans-serif; font-size:16px;
    padding: 9px; color: #A9A9A9 ; } .SubmitButton { background-color:#000000; color:#CCCCCC;
    width:100px; border:1px solid #666666; font-family:Verdana; font-size:10px; }
    -->
    </style>


    <script language="javascript1.2" type="text/javascript">
    <!--
    function emo_pop() {
    window.open('http://www.haloscan.com/commenthelp.php','Help','width=200,height=360,resizable=yes,scrollbars=yes');
    }
    //-->
    </script>

    </head>
    <body>
    <!--
    $Id: commentsuniversal.php,v 1.82.2.184 2007/09/02 17:58:41 halo Exp $
    -->


    <table width="97%" align="center" cellpadding="0" cellspacing="0" border="0" class="MainTable">
    <tr>
    <td>
    <div align="center">

    <p><b>No comments</b></p>




    </div>
    </td>
    </tr>



    <tr>
    <td class="InputCell">


    <div id="newcomment"></div><form method="post" name="addComment" action="http://www.haloscan.com/comments/xxxsinkemfastxxx/board/" target="_self">
    <p>

    Name: <br />
    <input name="name" type="text" size="38" value="asd" /><br />
    Email:<br />
    <input name="email" type="text" size="38" value="" /><br />
    URL: <br />
    <input name="url" type="text" size="38" value="" /><br />
    Comment:  <a href="javascript:emo_pop()" title="Smiley and tag help" target="_self">?</a> <a href="#" onclick='window.open("http://www.thumbsnap.com/?l=n","imgup","width=550,height=420,resizable=yes,scrollbars=yes"); return false;' title="Attach Image" target="_self"><img src="http://www.haloscan.com/images/image_link.gif" style="vertical-align:middle;" height="16" width="16" alt="Attach Image" border="0" /></a><br />
    <textarea name="addMessage" rows="12" cols="38"></textarea><br /><br />
    <input type="checkbox" name="subscribe" id="subscribe" value="1" />
    <label for="subscribe">Notify me of followup comments via email</label>
    </p>
    <p class="PSubmit"><input name="submit" type="submit" value="Publish" style="font-weight: bold;" class="SubmitButton" /> <input name="previewMessage" type="submit" value="Preview" class="SubmitButton" />
    </p>
    <input type='hidden' name='user' value='xxxsinkemfastxxx' /><input type='hidden' name='comment' value='board' /></form>
    </td>
    </tr>

    <tr>
    <td><p align="center">
    Commenting by <a href="http://www.haloscan.com/" target="_blank">HaloScan</a></p>
    </td>
    </tr>
    </table>

    <img src="http://c5.statcounter.com/counter.php?sc_project=561713&java=0&security=01eeff58" alt="" border="0" />
    <script type="text/javascript" src="http://edge.quantserve.com/quant.js"></script>
    <script type="text/javascript">
    _qacct="p-49-FCZj0ZfdfU";quantserve();</script>
    <noscript>
    <img src="http://pixel.quantserve.com/pixel/p-49-FCZj0ZfdfU.gif" style="display: none" height="1" width="1" alt="Quantcast"/></noscript>
    </body>
    </html>
     
  7. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #7
    Well I put together some of my own code and doing the #bottom technique doesn't seem to work. Guess you have to rely on JavaScript unless someone has some other ideas. I'll play with it a little bit and post any solutions i may come up with.
     
  8. ghking thread starter macrumors regular

    ghking

    Joined:
    Jul 21, 2007
    #8
    alright thank you that would be fantastic. cause im not too good at javascript.
     
  9. ghking thread starter macrumors regular

    ghking

    Joined:
    Jul 21, 2007
    #9
    alright thank you that would be fantastic. cause im not too good at javascript.
     
  10. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #10
    Well it seems manipulating iframes is harder than I realized. I've never used them much myself. I did find one partial solution though don't know if you'll be able to use it. I think it requires the iframe source file to be on the same server as the web page. At least that's what I've gathered in my readings. It's some type of permissions issue.

    As for the partial solution, check out this site, http://dynamicdrive.com/dynamicindex2/iframe-scroller.htm

    It does an animated scroll, but the basics are there that you would use. It may take a bit to get a handle on what's going on in the script. Good luck.
     
  11. ghking thread starter macrumors regular

    ghking

    Joined:
    Jul 21, 2007
  12. WildPalms macrumors 6502a

    WildPalms

    Joined:
    Jan 4, 2006
    Location:
    Honolulu, HI
    #12
    frames/iframes are bad. Apply a little ajax (dom + javascript) and you'll get a much better solution.

    Google for Prototype examples and/or visit the site: http://www.prototypejs.org/

    You drop in the reference to the prototype javascript library then call well coded and tested routines. Plus, you'll be able to get a lot of support from the community.
     

Share This Page