LiveWire Network Peer Answers Peer Support Teen Forums Tech Forums College Forums 469 users online 211588 members 191 active today Advertise Here Sign In
TeenCollegeTechPhotos | Quizzes | LiveSecret | Memberlist | Dictionary | News | FAQ
Member Spotlight
MustardMan661
Music: everything
Mood: Sensitive
You have 1 new message.
Emergency Help
Until you sign up you can't do much. Yes, it's free.

Sign Up Now
Membername:
Password:
Already have an account?
Invite Friends
Active Members
Groups
Contests
Moderators
3 online / 39 MPM
Fresh Topics
  LiveWire / Technical Forums / Web Design & Search Engine Optimization / Viewing Topic

Damn HTML!
Replies: 8Last Post Aug. 31, 2008 11:30am by Narfle the Garthok
Welcome to LiveWire!
We're Stronger Together.
Join the Community
Single page for this topic Email Print Favorite
( blufindr )


Asynchronous duality

Patron
Reply
I'm trying to get a site to work with floating iFrames, but the damn things don't float. Help?

-------
Two hearts, beating as one;
Keeping time
Until they are no longer
Apart

9:51 pm on Aug. 26, 2008 | Joined: April 2008 | Days Active: 316
Join to learn more about blufindr Australia | Label Free Female | Posts: 36,248 | Points: 41,967
Narfle the Garthok

Dairy Product Addict

Patron
Reply
Post your code, and I can fix it.

-------
YOU MUST
NARFLE THE GARTHOK!

Robdude is my LW Wife.

9:52 pm on Aug. 26, 2008 | Joined: June 2008 | Days Active: 93
Join to learn more about Narfle the Garthok Alaska, United States | Straight Male | Posts: 2,099 | Points: 1,762
iwashere85

Connoisseur

Patron
Reply
Sure, I'll help.

-------
Election Information

George Carlin FTW

9:53 pm on Aug. 26, 2008 | Joined: July 2007 | Days Active: 374
Join to learn more about iwashere85 Pennsylvania, United States | Straight Male | Posts: 4,891 | Points: 6,743
MrIndigo


Dairy Product Addict
Reply
Show us the script you used...


9:53 pm on Aug. 26, 2008 | Joined: May 2008 | Days Active: 90
Join to learn more about MrIndigo California, United States | Straight | Posts: 587 | Points: 1,552
( blufindr )


Asynchronous duality

Patron
Reply
Code:
<html>

<head>

<title>BLARGH</title>

<link rel="stylesheet" type="text/css" href="pages.css">

<link rel="stylesheet" type="text/css" href="home.css">

</head>

<body>

<marquee>Welcome to my site!</marquee>

<p></p>

<div id="nav">
<a href="1.html" target="1">1</a>
<p>
<a href="ohai.html" target="1">ohai</a>
</p>
</div>

<p></p>

<div id="1">

<iframe width="330" height="180" name="1" src="1.html" frameborder="0">I have an iFrame. You just can't see it. <a href="http://www.getfirefox.com/";>Get a better browser.</a></iframe>

</div>

</body>

</html>

First stylesheet:
Code:
body {
color: #FFFFFF;
font-family: helvetica, verdana, sans-serif;
background-color: #000000;
}

Second stylesheet:
Code:
#1 {
position:absolute;
       left: 600px;
       top: 220px;
       width: 330px;
       height: 180px;
       z-index: 100
}

div#nav {
position: absolute;
left: 200px;
top: 100px;
width: 100px;
height: 500px;
z-index: 1;
background-color: green;
}

body {
color: white;
font-family: helvetica, verdana, sans-serif;
background-color: #000000;
background-image: url('splatter copy.png');
background-repeat: no-repeat;
background-position: top left;
background-attachment: fixed;
}



-------
Two hearts, beating as one;
Keeping time
Until they are no longer
Apart


9:55 pm on Aug. 26, 2008 | Joined: April 2008 | Days Active: 316
Join to learn more about blufindr Australia | Label Free Female | Posts: 36,248 | Points: 41,967
scottyrob

Wealthy Hobo

Patron
Reply
Owch for using both iframes and the css - float... I hate both and both have compatiabilty problems. But them both together and youve got an inresting combination!

-------
Once a Red Bar, Always a Red Bar... Points are for lossers :)

5:08 am on Aug. 27, 2008 | Joined: Aug. 2005 | Days Active: 751
Join to learn more about scottyrob England, United Kingdom | Straight Male | Posts: 1,572 | Points: 5,990
Narfle the Garthok

Dairy Product Addict

Patron
Reply


I recommend using javascript to do this floating iframe because the CSS you is a bit messy.

Code:

//Specify iframe to display. Change src and other attributes except "position" and "left/top":
var iframetag='<iframe id="masterdiv" src="anything.htm" width="350px" height="250px" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="1" scrolling="no" style="position: absolute; left: -300px; top: -300px;"></iframe>'

//specify x coordinates of iframe ("right" for right corner, or a pixel number (ie: "20px")):
var masterdivleft="10px"

//specify y coordinates of iframe ("bottom" for bottom of page, or a pixel number (ie: "20px")):
var masterdivtop="bottom"

var ie=(document.all || window.opera) && document.getElementById
var iebody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body

if (ie)
document.write(iframetag)

function positionit(){
masterdivobj=document.getElementById("masterdiv")
var window_width=ie && !window.opera? iebody.clientWidth : window.innerWidth-20
window_height=ie && !window.opera? iebody.clientHeight : window.innerHeight
var dsocleft=ie? iebody.scrollLeft : pageXOffset
var masterdivwidth=masterdivobj.width
masterdivheight=masterdivobj.height
masterdivobj.style.left=(masterdivleft=="right")? window_width-masterdivwidth-20 : masterdivleft
setInterval("repositionit()", 100)
}

function repositionit(){
if (ie){
dsoctop=ie? iebody.scrollTop : pageYOffset
masterdivobj.style.top=(masterdivtop=="bottom")? window_height-masterdivheight-14+dsoctop : parseInt(masterdivtop)+dsoctop
}
}

if (window.attachEvent)
window.attachEvent("onload", positionit)

But that between the <head> </head> tags of your page or make it a .js file and call it in your <head></head> (whatever way you want to do it).

The downside of this is it is not FF compatible, but these days you rarely see anyone doing a floating iframe because of all the issues they can cause.

If you don't want to go about it that way, take some of the code from this and improve your existing CSS.  

Post edited at 8:30 am on Aug. 27, 2008 by Narfle the Garthok

-------
YOU MUST
NARFLE THE GARTHOK!

Robdude is my LW Wife.


7:28 am on Aug. 27, 2008 | Joined: June 2008 | Days Active: 93
Join to learn more about Narfle the Garthok Alaska, United States | Straight Male | Posts: 2,099 | Points: 1,762
( blufindr )


Asynchronous duality

Patron
Reply
Quote: from Narfle the Garthok at 12:28 am on Aug. 28, 2008


 
I recommend using javascript to do this floating iframe because the CSS you is a bit messy.

Code:

//Specify iframe to display. Change src and other attributes except "position" and "left/top":
var iframetag='<iframe id="masterdiv" src="anything.htm" width="350px" height="250px" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="1" scrolling="no" style="position: absolute; left: -300px; top: -300px;"></iframe>'

//specify x coordinates of iframe ("right" for right corner, or a pixel number (ie: "20px")):
var masterdivleft="10px"

//specify y coordinates of iframe ("bottom" for bottom of page, or a pixel number (ie: "20px")):
var masterdivtop="bottom"

var ie=(document.all || window.opera) && document.getElementById
var iebody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body

if (ie)
document.write(iframetag)

function positionit(){
masterdivobj=document.getElementById("masterdiv")
var window_width=ie && !window.opera? iebody.clientWidth : window.innerWidth-20
window_height=ie && !window.opera? iebody.clientHeight : window.innerHeight
var dsocleft=ie? iebody.scrollLeft : pageXOffset
var masterdivwidth=masterdivobj.width
masterdivheight=masterdivobj.height
masterdivobj.style.left=(masterdivleft=="right")? window_width-masterdivwidth-20 : masterdivleft
setInterval("repositionit()", 100)
}

function repositionit(){
if (ie){
dsoctop=ie? iebody.scrollTop : pageYOffset
masterdivobj.style.top=(masterdivtop=="bottom")? window_height-masterdivheight-14+dsoctop : parseInt(masterdivtop)+dsoctop
}
}

if (window.attachEvent)
window.attachEvent("onload", positionit)

But that between the <head> </head> tags of your page or make it a .js file and call it in your <head></head> (whatever way you want to do it).

The downside of this is it is not FF compatible, but these days you rarely see anyone doing a floating iframe because of all the issues they can cause.

If you don't want to go about it that way, take some of the code from this and improve your existing CSS.


Thanks But I got lazy and just decided to chuck everything in a table instead.

I'll remember that code for when I need to do this again though

-------
Two hearts, beating as one;
Keeping time
Until they are no longer
Apart


3:00 am on Aug. 31, 2008 | Joined: April 2008 | Days Active: 316
Join to learn more about blufindr Australia | Label Free Female | Posts: 36,248 | Points: 41,967
Narfle the Garthok

Dairy Product Addict

Patron
Reply
Quote: from blufindr at 3:00 am on Aug. 31, 2008

Quote: from Narfle the Garthok at 12:28 am on Aug. 28, 2008

 
 
 I recommend using javascript to do this floating iframe because the CSS you is a bit messy.  

 
Code:
 
 //Specify iframe to display. Change src and other attributes except "position" and "left/top":  
 var iframetag='<iframe id="masterdiv" src="anything.htm" width="350px" height="250px" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="1" scrolling="no" style="position: absolute; left: -300px; top: -300px;"></iframe>'  

 //specify x coordinates of iframe ("right" for right corner, or a pixel number (ie: "20px")):  
 var masterdivleft="10px"  

 //specify y coordinates of iframe ("bottom" for bottom of page, or a pixel number (ie: "20px")):  
 var masterdivtop="bottom"  

 var ie=(document.all || window.opera) && document.getElementById  
 var iebody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body  

 if (ie)  
 document.write(iframetag)  

 function positionit(){  
 masterdivobj=document.getElementById("masterdiv")  
 var window_width=ie && !window.opera? iebody.clientWidth : window.innerWidth-20  
 window_height=ie && !window.opera? iebody.clientHeight : window.innerHeight  
 var dsocleft=ie? iebody.scrollLeft : pageXOffset  
 var masterdivwidth=masterdivobj.width  
 masterdivheight=masterdivobj.height  
 masterdivobj.style.left=(masterdivleft=="right")? window_width-masterdivwidth-20 : masterdivleft  
 setInterval("repositionit()", 100)  
 }  

 function repositionit(){  
 if (ie){  
 dsoctop=ie? iebody.scrollTop : pageYOffset  
 masterdivobj.style.top=(masterdivtop=="bottom")? window_height-masterdivheight-14+dsoctop : parseInt(masterdivtop)+dsoctop  
 }  
 }  

 if (window.attachEvent)  
 window.attachEvent("onload", positionit)  
 

 

 But that between the <head> </head> tags of your page or make it a .js file and call it in your <head></head> (whatever way you want to do it).  

 The downside of this is it is not FF compatible, but these days you rarely see anyone doing a floating iframe because of all the issues they can cause.  

 If you don't want to go about it that way, take some of the code from this and improve your existing CSS.    

 


Thanks But I got lazy and just decided to chuck everything in a table instead.

I'll remember that code for when I need to do this again though


Haha guess that works to, well no problem if you ever need anything related to Web Design/Development feel free to PM me.

-------
YOU MUST
NARFLE THE GARTHOK!

Robdude is my LW Wife.


11:30 am on Aug. 31, 2008 | Joined: June 2008 | Days Active: 93
Join to learn more about Narfle the Garthok Alaska, United States | Straight Male | Posts: 2,099 | Points: 1,762
Single page for this topic Email Print Favorite

Quick Reply

You are signed in as our guest.

Looking for something else?
 

  LiveWire / Technical Forums / Web Design & Search Engine Optimization / Viewing Topic