LiveWire Network Peer Answers Peer Support Teen Forums Tech Forums College Forums 520 users online 221622 members 1695 active today Advertise Here Sign In
TeenCollegeTechPhotos | Quizzes | LiveSecret | Memberlist | Dictionary | News | FAQ
Member Spotlight
majorwolf
Music: mcr,3 days grace,franz ferdinand,gnarls...
Mood: Tired
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
5 online / 26 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 )


Darlin', rescue me.

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

-------
Must I prove to you how good we are together?

9:51 pm on Aug. 26, 2008 | Joined: April 2008 | Days Active: 348
Join to learn more about blufindr Australia | Label Free Female | Posts: 37,769 | Points: 42,632
LiveWire Humor
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,095 | Points: 1,758
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: 586 | Points: 1,551
( blufindr )


Darlin', rescue me.

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;
}



-------
Must I prove to you how good we are together?


9:55 pm on Aug. 26, 2008 | Joined: April 2008 | Days Active: 348
Join to learn more about blufindr Australia | Label Free Female | Posts: 37,769 | Points: 42,632
scottyrob

Connoisseur

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: 753
Join to learn more about scottyrob England, United Kingdom | Straight Male | Posts: 1,570 | Points: 6,028
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,095 | Points: 1,758
( blufindr )


Darlin', rescue me.

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

-------
Must I prove to you how good we are together?


3:00 am on Aug. 31, 2008 | Joined: April 2008 | Days Active: 348
Join to learn more about blufindr Australia | Label Free Female | Posts: 37,769 | Points: 42,632
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,095 | Points: 1,758
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