www.webdeveloper.com
Results 1 to 8 of 8

Thread: Can we disable links inside iframes ?

  1. #1
    Join Date
    Jun 2005
    Posts
    94

    Can we disable links inside iframes ?

    Hi,
    I import an iframe into my webpage. Is it possible to disable all hyperlinks within that iframe using css???

    Your help would be appreciated.
    Thanks

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Not with css, but with JavaScript and only if the iframe document is part of your site.
    At least 98% of internet users' DNA is identical to that of chimpanzees

  3. #3
    Join Date
    Dec 2009
    Posts
    1

    CSS Can Do It!

    This reply is a few years late but, as someone who hunted high and low before working out a solution to this problem, I thought it might help others who are trying to resolve the same issue.

    An alternative method is to use CSS with a transparent image. It works like this:

    01. Determine the size and position of your <iframe>

    02. Create a <div> which covers the area of the iframe
    - position: set left, height, top and width attributes as appropriate
    - z-index: some number higher than the z-index for the iframe
    - background: url(/path/image.gif)

    The default is for the transparent image to be positioned at the top left of the <div> and to be repeated along the x and y axes so that it covers the whole area of the <div>. If this is not your default behaviour (perhaps because of some other style setting) then you will have to set background-repeat explicitly.

    The practical effect of this solution is that your <iframe> can be seen but none of the content is clickable because the <div> with a background image has a higher z-index value than the <iframe>.

    If you have scrollbars enabled, remember to set the <div> width and height attributes so that you can still get at the scrollbars!

    To create a transparent gif file (assuming you are running Windows), open Paint and create a single colour image. It does not need to be very large. Save it as a .gif file then open an image editor such as myimager.com, upload the file and select the transparency option. (In myimager.com, this can be found under Adjust -> Transparent.

    Save the now transparent file in an appropriate folder on your webserver and reference it in your <div> attributes.

  4. #4
    Join Date
    Jun 2005
    Location
    United Kingdom
    Posts
    1,043
    IE6 has problems with Z index - and IE6 is still in use by some businesses because of legacy application issues. I am not sure about IE7 either - perhaps someone else can enlighten.

  5. #5
    Join Date
    Dec 2009
    Location
    SoCal
    Posts
    1
    Quote Originally Posted by thomasm1964 View Post
    This reply is a few years late but, as someone who hunted high and low before working out a solution to this problem, I thought it might help others who are trying to resolve the same issue.

    An alternative method is to use CSS with a transparent image. It works like this:

    01. Determine the size and position of your <iframe>

    02. Create a <div> which covers the area of the iframe
    - position: set left, height, top and width attributes as appropriate
    - z-index: some number higher than the z-index for the iframe
    - background: url(/path/image.gif)

    The default is for the transparent image to be positioned at the top left of the <div> and to be repeated along the x and y axes so that it covers the whole area of the <div>. If this is not your default behaviour (perhaps because of some other style setting) then you will have to set background-repeat explicitly.

    The practical effect of this solution is that your <iframe> can be seen but none of the content is clickable because the <div> with a background image has a higher z-index value than the <iframe>.

    If you have scrollbars enabled, remember to set the <div> width and height attributes so that you can still get at the scrollbars!

    To create a transparent gif file (assuming you are running Windows), open Paint and create a single colour image. It does not need to be very large. Save it as a .gif file then open an image editor such as myimager.com, upload the file and select the transparency option. (In myimager.com, this can be found under Adjust -> Transparent.

    Save the now transparent file in an appropriate folder on your webserver and reference it in your <div> attributes.
    I have been trying to figure this one out because I have iframe created by a custom bbcode on my forum. Where do you create the <div> and where does it go?

  6. #6
    Join Date
    Mar 2013
    Posts
    23
    Quote Originally Posted by Websurfer View Post
    I have been trying to figure this one out because I have iframe created by a custom bbcode on my forum. Where do you create the <div> and where does it go?
    I wonder if someone could take up this thread, please.

  7. #7
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,360
    Your going to have to modify the script that generates the page to insert a div with a class that calls a transparent image to be 100% of width and height and for double security, min-height and min-width to be also 100% of the DIV height & width.

    A transparent image can be a .png image.
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  8. #8
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,467

    I wonder if someone could take up this thread, please.
    Come on you naughty boy, you know very well how to do this.

    You have been shown the method on numerous occasions.

    It is also extremely bad form to resurrect old threads.

    I will have to come round to your hotel and slap your bottom.


    coothead

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles