1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

How can i add a X(Close button) to this Iframe

Discussion in 'JavaScript' started by MeanVale, Aug 18, 2010.

  1. #1
    Hi,

    I want to add either a Close button or X for this Iframe.

    http://173.242.112.40/DP/

    I have been searching but keep coming across errors.

    <div id="Html1" style="position:absolute;left:159px;top:444px;width:188px;height:96px;z-index:0">
    
    <style type="text/css">
    #outerdiv
    {
    width:276px;
    height:110px;
    overflow:hidden;
    position:relative;
    }
    
    #inneriframe
    {
    position:absolute;
    top:-10px;
    left:-120px;
    width:1280px;
    height:1200px;
    }
    </style>
    
    <div id='outerdiv'>
    <iframe src="http://www.google.com.hk/webhp?hl=zh-CN&sourceid=cnhp" id='inneriframe' scrolling=no></iframe>
    </div></div>
    PHP:
     
    MeanVale, Aug 18, 2010 IP
  2. camjohnson95

    camjohnson95 Active Member

    Messages:
    737
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    60
    #2
    Just add a button or link to 'outerdiv' that when clicked hides the 'outerdiv'. Then use CSS to position the button wherever you want:
    
    <div id='outerdiv'>
    [B]<a href="javascript:closeFrame();">[X]</a>[/B]
    <iframe src="http://www.google.com.hk/webhp?hl=zh-CN&sourceid=cnhp" id='inneriframe' scrolling=no></iframe>
    </div>
    [B]<script type="text/javascript">
    function closeFrame() {
        document.getElementById("outerdiv").style.display="none";
    }
    </script>[/B]
    
    Code (markup):
    Some example CSS:
    
            #outerdiv 
            {
                position: relative;
                width: 500px;
            }
            #outerdiv a 
            {
                position: absolute;
                top: 0px;
                right: 0px;
            }
            #outerdiv iframe 
            {
                width: 100%;
            }
    
    Code (markup):
    You could add an image of a close button to the link if you wanted.
     
    camjohnson95, Aug 18, 2010 IP
  3. moviemaniaonline

    moviemaniaonline Greenhorn

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    21
    #3
    please let me know complete code , need for my website : http://www.moviemaniaonline.com/
     
    moviemaniaonline, Nov 11, 2016 IP