[Boards: 3 / a / aco / adv / an / asp / b / bant / biz / c / can / cgl / ck / cm / co / cock / d / diy / e / fa / fap / fit / fitlit / g / gd / gif / h / hc / his / hm / hr / i / ic / int / jp / k / lgbt / lit / m / mlp / mlpol / mo / mtv / mu / n / news / o / out / outsoc / p / po / pol / qa / qst / r / r9k / s / s4s / sci / soc / sp / spa / t / tg / toy / trash / trv / tv / u / v / vg / vint / vip / vp / vr / w / wg / wsg / wsr / x / y ] [Search | Free Show | Home]

I'm having trouble getting objects on an HTML page appe

This is a blue board which means that it's for everybody (Safe For Work content only). If you see any adult content, please report it.

Thread replies: 19
Thread images: 5

File: please help me.png (93KB, 1024x768px) Image search: [Google]
please help me.png
93KB, 1024x768px
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.
>>
File: html test black blue 1.png (18KB, 1024x768px) Image search: [Google]
html test black blue 1.png
18KB, 1024x768px
>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.
>>
File: 1475908682572.jpg (561KB, 1000x1167px) Image search: [Google]
1475908682572.jpg
561KB, 1000x1167px
sorry flan, I don't have flash so I can't test it. try using w3schools or something to learn about the issue
>>
File: waving-flan.gif 1452054610617.gif (90KB, 450x325px) Image search: [Google]
waving-flan.gif 1452054610617.gif
90KB, 450x325px
>>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
>>
File: c test42.htm winode resizing.png (27KB, 1366x1080px) Image search: [Google]
c test42.htm winode resizing.png
27KB, 1366x1080px
>>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
Thread posts: 19
Thread images: 5


[Boards: 3 / a / aco / adv / an / asp / b / bant / biz / c / can / cgl / ck / cm / co / cock / d / diy / e / fa / fap / fit / fitlit / g / gd / gif / h / hc / his / hm / hr / i / ic / int / jp / k / lgbt / lit / m / mlp / mlpol / mo / mtv / mu / n / news / o / out / outsoc / p / po / pol / qa / qst / r / r9k / s / s4s / sci / soc / sp / spa / t / tg / toy / trash / trv / tv / u / v / vg / vint / vip / vp / vr / w / wg / wsg / wsr / x / y] [Search | Top | Home]

I'm aware that Imgur.com will stop allowing adult images since 15th of May. I'm taking actions to backup as much data as possible.
Read more on this topic here - https://archived.moe/talk/thread/1694/


If you need a post removed click on it's [Report] button and follow the instruction.
DMCA Content Takedown via dmca.com
All images are hosted on imgur.com.
If you like this website please support us by donating with Bitcoins at 16mKtbZiwW52BLkibtCr8jUg2KVUMTxVQ5
All trademarks and copyrights on this page are owned by their respective parties.
Images uploaded are the responsibility of the Poster. Comments are owned by the Poster.
This is a 4chan archive - all of the content originated from that site.
This means that RandomArchive shows their content, archived.
If you need information for a Poster - contact them.