I'm having trouble getting objects on an HTML page appear where I want them to. - I want "blue.swf" to appear on the bottom, and "black.swf" to appear on the top - but so far blue takes up everything - assuming black is in the back.
I'm not really a programmer, or coder, or into HTML or anything. But I want to do this. So I need help. - I did look it up. But I can't seem to find a solution that works. - I don't know who else to turn to.
Here's the HTML www page.
http://ac.pcriot.com/c/test
Please help me.
Thank you.
>continued
Pic related. It's what I'm trying to get it to look like.
Also again I'm not a coding expert or anything. So preferably the code would be edited and pasted.
Keep in mind that the www host updates slowly. So I may have to update "test2", "test3", etc. to post updates right away.
Also I'm not trying to advertise. I just thought that if I posted it then it would be easier to understand, and that more would be interested in helping, since they can see the result. Please understand.
Also I may be interested in contacting anyone who is interested about this through e-mail or something. So I don't have to bother everyone all the time. If anyone's interested.
Thank you.
>continued
Here's the HTML code.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="language" content="en" />
<meta name="author" content="anon" />
<title>test</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script type="text/javascript" src="blue.js"></script>
<style type="text/css">
html {overflow:hidden}
body {}
#black {
align: top
bottom: 300px;
}
#blue {
align: bottom
}
</style>
</head>
<body>
<div id="black_align" style="position:absolute;top:-0px;bottom:-0px;right:-0px;left:-0px;">
<div id="black" style="">
<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p>
</div>
</div>
<div id="blue_align" style="position:absolute;top:-9px;bottom:-7px;right:-12px;left:-9px;">
<div id="blue" style="">
<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p>
</div>
</div>
<script type="text/javascript">
swfobject.embedSWF("black.swf", "black", "100%", "100%", "10.0.0", "expressInstall.swf");
swfobject.embedSWF("blue.swf", "blue", "100%", "100%", "10.0.0", "expressInstall.swf", params);
</script>
</body>
</html>
That's it.
>continued
Also I don't really post anything anywhere anymore. 1 of the main reasons is that you can't delete threads anymore. So - if the thread goes bad - then you can't do anything. It either your thread remains bad, mod deletes all your posts, mod bans you, etc.. Instead of just letting you delete your thread. Just inb4'ing it. Thank you.
>the end
Thank you.
sorry flan, I don't have flash so I can't test it. try using w3schools or something to learn about the issue
>>57220664
>sorry flan, I don't have flash so I can't test it. try using w3schools or something to learn about the issue
well I put "get flash" code there, but alright.
>>57220567
>I did look it up. But I can't seem to find a solution that works. - I don't know who else to turn to.
thanks anyway
OK I fully tested this code this time and I swear it works. I should stop posting code without even testing it, it always never works.
But there is a "spam" error message every time I post it. So I put it on pastebin. http://pastebin.com/DW47s12t
>>57220909
>[Deleted]
>>57220925
>Oops, fucked it up. Reposting.
>
><html>
<head>
<style>
html {
height:100%;
}
body {
height: 100%;
margin: 0%;
}
.swf_container{
width:100%;
}
#bottom_swf{
height:192px;
}
</style>
<script type="text/javascript">
function resizeTopSWF() {
newheight = document.body.scrollHeight - parseInt(document.getElementById('bottom_swf').style.height)
document.getElementById('top_swf').style.height = newheight + "px";
}
</script>
</head>
<body onresize="resizeTopSWF()">
<div id="top_swf" class="swf_container"></div>
<div id="bottom_swf" class="swf_container"></div>
</body>
</html>
>
>Not tested fully BTW.
>>57221036
>OK I fully tested this code this time and I swear it works. I should stop posting code without even testing it, it always never works.
>
>
>But there is a "spam" error message every time I post it. So I put it on pastebin. http://pastebin.com/DW47s12t
Alright. Full disclosure. I'm actually using it for a chat. And need the "*.js" to get the parameters out of it. I don't want it to look like advertising. I also posted the code in hopes it would be edited and intact enough to use instead of re-written.
Your code is great and seems to work. It doesn't have the "black.swf" or "blue.swf" in it though. Also "blue.swf" or now "c.swf" needs to get the "testing.js" params. Or have them all on the page at least, I guess.
Well at least you didn't get banned. Here's what I tried inserting the flash into. http://pastebin.com/ik3uaa7m
Here's a test page it was tried on. http://ac.pcriot.com/c/test27
Still this is really great. Thank you.
>>57221446
OK I changed it a little. You can put the script you wrote anywhere. It appears that function you posted depends on the id of the elements so I changed them. I also put a child inside the containers because it appears to completely replace the elements.
http://pastebin.com/m4SBzvpB
>>57221634
>OK I changed it a little. You can put the script you wrote anywhere. It appears that function you posted depends on the id of the elements so I changed them. I also put a child inside the containers because it appears to completely replace the elements.
>
>http://pastebin.com/m4SBzvpB
Oh. I see. Thank you. This is really good.
But "<div id="blue_align" style="position:absolute;top:-9px;bottom:-7px;right:-12px;left:-9px;">" is important. -
I use that to edge-out the edges of the swf. This is important.
- Originally I was trying to figure out how to do that. I did by putting it inside the "blue_align" container. I did the same for the "black_align" container for symmetry and a place-holder, in-case it is needed.
Here's the test page. And the script, tho it may exactly match yours, for completeness.
http://ac.pcriot.com/c/test34
http://pastebin.com/sPCsmwL1
Thank you.
>>57221796
OK I changed it so the borders are hidden like you wanted, but I had to make the width adjust automatically to the page in JS. Not sure how to do it in CSS. But I also had to hide the scrolling. Check it out at http://pastebin.com/ZKdQqU4z
>>57222029
>OK I changed it so the borders are hidden like you wanted, but I had to make the width adjust automatically to the page in JS. Not sure how to do it in CSS. But I also had to hide the scrolling. Check it out at http://pastebin.com/ZKdQqU4z
Thank you. I don't know. Looks good.
There were problems without me doing anything to it. But I did something to it, too.
I took -swfobject.embedSWF("c.swf", "bottom_swf_chi", "100%", "100%", "10.0.0", "expressInstall.swf");
- and made it -swfobject.embedSWF("c.swf", "bottom_swf_chi", "100%", "100%", "10.0.0", "expressInstall.swf", params);
'Cause I think the "params" part maks it get the params from here -<script type="text/javascript" src="testing.js"></script>
Unedited result here.
http://ac.pcriot.com/c/test41
Result with "params" here.
http://ac.pcriot.com/c/test42
Here's the pastebin paste.
http://pastebin.com/E2v3sWGY
Thank you.
>>57220567
install JQuery
>>57222348
>install JQuery
need portable
>>57222029
>>57221796
Oh I did some googling and there is a full CSS solution to the height and width calculations. You can delete function resizeSWFs() { ... } and the paramters linking to it in the body element, then change the style for these elements to add the calc() function.
Of course, keep all the other stuff in the CSS.#top_swf{
height: calc(100% - 192px)
}
#bottom_swf_chi{
width: calc(18px + 100%);;
>>57222332
In 42, it looks like the position: absolute; was removed from #bottom_swf_chi{ ... }. Otherwise, it looks fine.
>>57222570
>In 42, it looks like the position: absolute; was removed from #bottom_swf_chi{ ... }. Otherwise, it looks fine.
Yeah, but it's not exactly this was -<div id="blue_align" style="position:absolute;top:-9px;bottom:-7px;right:-12px;left:-9px;">
- - so I changed it to this -#bottom_swf_chi{
z-index:1;
height: 211px;
position: absolute;
bottom:-10px;
left:-9px
}
- it's really good and working. But there's a minor issue. It's why I used "top, bottom, right, left" in the "*_align" container when I started.
The right-side of the SWF shows. So you take away 2 pixels from the "left:-*px".#bottom_swf_chi{
z-index:1;
height: 211px;
position: absolute;
bottom:-10px;
left:-7px
}
But then the right-side shows. If you do "right:-*px" then it doesn't seem to effect it at all. So again that's why I was using "top, bottom, right, left". So I could stretch all-ways without issue. I know it's minor. But, that's what I was trying to do.
Here's the pagebin and page. http://pastebin.com/hkYJFPhZ http://pastebin.com/test76
Thank you.
>>57222457
>Oh I did some googling and there is a full CSS solution to the height and width calculations. You can delete function resizeSWFs() { ... } and the paramters linking to it in the body element, then change the style for these elements to add the calc() function.
>
>Of course, keep all the other stuff in the CSS.
>
>#top_swf{
height: calc(100% - 192px)
}
#bottom_swf_chi{
width: calc(18px + 100%);;
test77 didn't work. It's just a blank white page, Apparently.
http://ac.pcriot.com/c/test77
http://pastebin.com/JfxxGmq6
I tried changing somethings. Can't seem to get it to stop being a white page still.
http://pastebin.com/test82
http://pastebin.com/XVj4Tqjx