Announcements |
September 13th, 2017: Adding tutorials for the badging community! We're looking for volunteers to feature and help us write guides - PM Panton to get started with our project!
July 3rd, 2017: Canvas Tutorials is currently undergoing a major revamp. Please excuse any hiccups or glitches.
Coming soon
|
About Us |
Canvas creates and supports an IMVU education environment. We offer tutorials and assistance from some of the community's most active and knowledgeable. Tutorials by users, for users!
|
400>400> Statistics | We have 1428 registered users The newest registered user is zZbannyezZ
Our users have posted a total of 2569 messages in 157 subjects
|
| | Need help with codes..... | |
| JadeMoon
Location : Finland
| Subject: Need help with codes..... Fri Oct 14, 2016 5:18 pm | |
| I don't know if that's what coding is supposed to look like, but the problem is when I add the layout on my homepage there appears some large white blank box above the layout. I don't think it's supposed to be there. Here's the code though, you can edit it if there's errors. I added some other stuff there too, a code for music for example which doesn't need fixing but the rest might need some fixing. You see the address for my layout here in the code if you feel like you need to see it, there's no profile pic added there though which I did on purpose. - Code:
-
<script> function changeNavigation(id) document.getElementByld(mainbox'). innerHTML=document.getElement(id). innerHTML} </script> <img style="float:center:"src="http://imageshack.com/a/img922/1307/rH0cSp.png" usemap="#ImageMap1">
<map id="ImageMap1" name="ImageMap1"> <area shape="rect" coords="6,10,895,698" id="1b" onClick="changeNavigation('Home')"> <area shape="rect" coords="6,662,140,698" id="2b" onClick="changeNavigation('About')"> <area shape="rect" coords="140,662,305,698" id="3b" onClick="changeNavigation('Friends')"> <area shape="rect" coords="305,662,485,698" id="4b" onClick="changeNavigation('Interests')"> <area shape="rect" coords="485,662,690,698" id="5b" onClick="changeNavigation('Love')"> <area shape="rect" coords="690,662,895,698"
<div id="mainbox" style="position:absolute;left:153; top:312; width:525; height:185; overflow: auto; border:0px; background- color:transparent; color:#000000;"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [Main] </div>
<div id="Home" style="display:none"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [Home] </font</center> </div>
<div id="About" style="display:none"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [About] </font</center> </div>
<div id="Friends" style="display:none"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [Friends] </font</center> </div>
<div id="Interests" style="display:none"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [Interests] </font</center> </div>
<div id="Love" style="display:none"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [Love] </font</center> </div>
<div id="video_box" style="width:300px; height:200px; position:absolute; left:283px; top: 363px; z-index:1"> </div>
<div id="avatar_box" style="width:160px; height:220px; position:absolute; left:326px; top: 106px; z-index:1"> </div>
<div id="product_box" style="width:378px; height:343px; position:absolute; left:388px; top: 39px; z-index:1"> </div>
<style type="text/css"> #aboutme_panel, #contact_panel, #dev_panel, #wishlist_panel, #visitors_panel, #messages_panel, #tagcloud_panel, #stickers_panel, #collect_panel, #room_panel, #rankings_panel, #cool_panel, #gallery_panel, #friends_panel, #sandbox_panel, #slideshow_panel, #video_panel, #rss_panel, #url_panel, #special_panel,#outfits_panel { width:900px !important; } #rightColumn { display:none !important; } </style>
<style type="text/css"> #url_panel_colRow, .imvucodes_net { display:none !important; } </style>
<style type="text/css"> .paneltitle, .panelmenu, .imvucodes_net { display:none !important; } </style>
</font>
</script>
<center>
<font face="verdana" size="1" color="grey">
<img scr="http://imageshack.com/a/img922/1307/rH0cSp.png" width ="900" height="700" border="0" usemap="ImageMap1">
<div id="main_box" style="width:493px; height="265px; position:absolute; left:153px; top:391px; z-index:1; overflow:auto;"> <iframe src="http://filedrive.imvustylez.net/users/NikitaBlack/N-Home.html" name="inlineframe" width="493" height="265" border="0" marginwidth=0 marginheight=0 frameborder=0 allowtransparency="true"></iframe> </div>
<map id="ImageMap1" name="ImageMap1"><area shape="rect" alt="" title="" coords="6,93,58,132" href="http://www.imvu.com/catalog/web_mypage.php?block=141775358" target="inlineframe" /><area shape="rect" alt="" title="" coords="66,94,128,132" href="imvu:StartIM?avatar=NikitaBlack&fromSite=1" target="inlineframe" /><area shape="rect" alt="" title="" coords="138,95,192,131" href="javascript:IMVU.messagePopupShow({force_recipient_id:141775358})" target="inlineframe" /><area shape="rect" alt="" title="" coords="202,96,255,134" href="http://www.imvu.com/catalog/web_add_contact.php?contact=NikitaBlack" target="inlineframe" /><area shape="rect" alt="" title="" coords="14,663,104,692" href="http://filedrive.imvustylez.net/users/NikitaBlack/N-Home.html" target="inlineframe" /><area shape="rect" alt="" title="" coords="173,662,274,692" href="http://filedrive.imvustylez.net/users/NikitaBlack/N-About.html" target="inlineframe" /><area shape="rect" alt="" title="" coords="328,661,449,693" href="http://filedrive.imvustylez.net/users/NikitaBlack/N-Friends.html" target="inlineframe" /><area shape="rect" alt="" title="" coords="513,662,649,692" href="http://filedrive.imvustylez.net/users/NikitaBlack/N-Interests.html" target="inlineframe" /><area shape="rect" alt="" title="" coords="717,663,803,693" href="http://filedrive.imvustylez.net/users/NikitaBlack/N-Love.html" target="inlineframe" /><!-- Created by Online Image Map Editor (http://www.maschek.hu/imagemap/index) --></map>
<style type="text/css">.playerbutton{cursor:pointer;border:none;background:transparent;outline:none;display:inline}.gaf210codes_youtubebox,.preload_box{width:1px;height:1px;overflow:hidden;visibility:hidden;position:absolute;display:inline}</style> <script type="text/javascript" src="http://www.youtube.com/player_api"></script> <script type="text/javascript">function toggleButtonPlayer_FeO7m(buttonobj){buttonobj.style.display="none";if(buttonobj.id=="gaf210codes-FeO7m-playbutton"){document.getElementById("gaf210codes-FeO7m-pausebutton").style.display="inline";}else{document.getElementById("gaf210codes-FeO7m-playbutton").style.display="inline";}}/*Youtube player code generated @ http://gaf210.imvustylez.net*/</script> <div class="gaf210codes_youtubebox"><iframe width="250" height="250" src="https://www.youtube.com/embed/?list=PLbtSjWnjv1zDBIyjPri8AdRkOyWjhK0gP&index=0&listType=playlist&enablejsapi=1&fs=0&rel=0&showinfo=0&modestbranding=1&iv_load_policy=3&controls=0&autoplay=1&loop=1" onload="gaf210codes_FeO7m=new YT.Player(this)"></iframe></div> <button type="button" class="playerbutton" id="gaf210codes-FeO7m-playbutton" onclick="gaf210codes_FeO7m.playVideo();toggleButtonPlayer_FeO7m(this)" style="display:none"><img src="http://i62.tinypic.com/axnot0.jpg"></button><button type="button" class="playerbutton" id="gaf210codes-FeO7m-pausebutton" onclick="gaf210codes_FeO7m.pauseVideo();toggleButtonPlayer_FeO7m(this)"><img src="http://i57.tinypic.com/2mqugw2.jpg"></button><div class="preload_box"><img src="http://i62.tinypic.com/axnot0.jpg"><img src="http://i57.tinypic.com/2mqugw2.jpg"></div><input style="outline:none" type="range" min="0" max="100" onchange="gaf210codes_FeO7m.setVolume(this.value)">
<div id="avatar_box" style="width:160px; height:220; position:absolute; left:328px; top:100px; z-index:1"> <!--Code by Antonio82 Avi Image Gen - Found at http://imvmoo.co.uk--> <img src="http://www.imvu.com/catalog/web_av_pic.php?av=NikitaBlack" width="160px" height="220px" border="0" alt="NikitaBlack" /> </div>
<style type=text/css"> # aboutme_panel, # contact_panel, # dev_panel, # wishlist_panel, # visitors_panel, # messages_panel, # tagcloud_panel, #stickers_panel, # collect_panel, # room_panel, # rankings_panel, #cool_panel, # gallery_panel, # friends_panel, # video_panel, # rss_panel, # url_panel, # special_panel, # outfits_panel { width:900px !important; } #rightColumn { display:none !important; } </style>
<center> |
| | | Pantone
Role : Designer & Coder Location : Indianapolis, IN, USA
| | | | dako
Role : Designer & Coder
| Subject: Re: Need help with codes..... Mon Oct 17, 2016 11:32 am | |
| @NikitaBlackI see that you had put two of the same image in your code, and that is where that box came from. It was from the repeated image. So, I removed it, and it seems to be pretty normal now.
//Except that your boxes are off (to me)- Click for code:
- Code:
-
<script> function changeNavigation(id) document.getElementByld(mainbox'). innerHTML=document.getElement(id). innerHTML} </script> <img style="float:center:"src="http://imageshack.com/a/img922/1307/rH0cSp.png" usemap="#ImageMap1">
<div id="mainbox" style="position:absolute;left:153; top:312; width:525; height:185; overflow: auto; border:0px; background-color:transparent; color:#000000;"> <center> <font face="verdana"size="1" color="grey"> DYNAMIC! [Main] </div>
<div id="Home" style="display:none"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [Home] </font</center> </div>
<div id="About" style="display:none"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [About] </font</center> </div>
<div id="Friends" style="display:none"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [Friends] </font</center> </div>
<div id="Interests" style="display:none"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [Interests] </font</center> </div>
<div id="Love" style="display:none"> <center> <font face="verdana" size="1" color="grey"> DYNAMIC! [Love] </font</center> </div>
<div id="video_box" style="width:300px; height:200px; position:absolute; left:283px; top: 363px; z-index:1"> </div>
<div id="avatar_box" style="width:160px; height:220px; position:absolute; left:326px; top: 106px; z-index:1"> </div>
<div id="product_box" style="width:378px; height:343px; position:absolute; left:388px; top: 39px; z-index:1"> </div>
<style type="text/css"> #aboutme_panel, #contact_panel, #dev_panel, #wishlist_panel, #visitors_panel, #messages_panel, #tagcloud_panel, #stickers_panel, #collect_panel, #room_panel, #rankings_panel, #cool_panel, #gallery_panel, #friends_panel, #sandbox_panel, #slideshow_panel, #video_panel, #rss_panel, #url_panel, #special_panel,#outfits_panel { width:900px !important; } #rightColumn { display:none !important; } </style>
<style type="text/css"> #url_panel_colRow, .imvucodes_net { display:none !important; } </style>
<style type="text/css"> .paneltitle, .panelmenu, .imvucodes_net { display:none !important; } </style>
</font>
<div id="main_box" style="width:493px; height="265px; position:absolute; left:153px; top:391px; z-index:1; overflow:hidden;"> <iframe src="http://filedrive.imvustylez.net/users/NikitaBlack/N-Home.html" name="inlineframe" width="100%" height="100%" border="0" marginwidth=0 marginheight=0 frameborder=0 allowtransparency="true"></iframe> </div>
<map id="ImageMap1" name="ImageMap1"> <area shape="rect" alt="" title="" coords="6,93,58,132" href="http://www.imvu.com/catalog/web_mypage.php?block=141775358" target="inlineframe" /> <area shape="rect" alt="" title="" coords="66,94,128,132" href="imvu:StartIM?avatar=NikitaBlack&fromSite=1" target="inlineframe" /> <area shape="rect" alt="" title="" coords="138,95,192,131" href="javascript:IMVU.messagePopupShow({force_recipient_id:141775358})" target="inlineframe" /> <area shape="rect" alt="" title="" coords="202,96,255,134" href="http://www.imvu.com/catalog/web_add_contact.php?contact=NikitaBlack" target="inlineframe" /> </*Page Section/*>
<area shape="rect" alt="" title="" coords="14,663,104,692" href="http://www.filedrive.imvustylez.net/users/NikitaBlack/N-Home.html" target="inlineframe" /> <area shape="rect" alt="" title="" coords="173,662,274,692" href="http://www.filedrive.imvustylez.net/users/NikitaBlack/N-About.html" target="inlineframe" /> <area shape="rect" alt="" title="" coords="328,661,449,693" href="http://www.filedrive.imvustylez.net/users/NikitaBlack/N-Friends.html" target="inlineframe" /> <area shape="rect" alt="" title="" coords="513,662,649,692" href="http://www.filedrive.imvustylez.net/users/NikitaBlack/N-Interests.html" target="inlineframe" /> <area shape="rect" alt="" title="" coords="717,663,803,693" href="http://www.filedrive.imvustylez.net/users/NikitaBlack/N-Love.html" target="inlineframe" /> <!-- Created by Online Image Map Editor (http://www.maschek.hu/imagemap/index) --></map>
<div id="Music" style="width:250px; height:250; position:absolute; left:328px; top:750px; z-index:1"> <style type="text/css">.playerbutton{cursor:pointer;border:none;background:transparent;outline:none;display:inline}.gaf210codes_youtubebox,.preload_box{width:1px;height:1px;overflow:hidden;visibility:hidden;position:absolute;display:inline}</style> <script type="text/javascript" src="http://www.youtube.com/player_api"></script> <script type="text/javascript">function toggleButtonPlayer_FeO7m(buttonobj){buttonobj.style.display="none";if(buttonobj.id=="gaf210codes-FeO7m-playbutton"){document.getElementById("gaf210codes-FeO7m-pausebutton").style.display="inline";}else{document.getElementById("gaf210codes-FeO7m-playbutton").style.display="inline";}}/*Youtube player code generated @ http://gaf210.imvustylez.net*/</script> <div class="gaf210codes_youtubebox"><iframe width="250" height="250" src="https://www.youtube.com/embed/?list=PLbtSjWnjv1zDBIyjPri8AdRkOyWjhK0gP&index=0&listType=playlist&enablejsapi=1&fs=0&rel=0&showinfo=0&modestbranding=1&iv_load_policy=3&controls=0&autoplay=1&loop=1" onload="gaf210codes_FeO7m=new YT.Player(this)"></iframe></div> <button type="button" class="playerbutton" id="gaf210codes-FeO7m-playbutton" onclick="gaf210codes_FeO7m.playVideo();toggleButtonPlayer_FeO7m(this)" style="display:none"><img src="http://i62.tinypic.com/axnot0.jpg"></button><button type="button" class="playerbutton" id="gaf210codes-FeO7m-pausebutton" onclick="gaf210codes_FeO7m.pauseVideo();toggleButtonPlayer_FeO7m(this)"><img src="http://i57.tinypic.com/2mqugw2.jpg"></button><div class="preload_box"><img src="http://i62.tinypic.com/axnot0.jpg"><img src="http://i57.tinypic.com/2mqugw2.jpg"></div><input style="outline:none" type="range" min="0" max="100" onchange="gaf210codes_FeO7m.setVolume(this.value)"> </div>
<div id="avatar_box" style="width:160px; height:220; position:absolute; left:328px; top:100px; z-index:1"> <img src="http://www.imvu.com/catalog/web_av_pic.php?av=NikitaBlack" width="160px" height="220px" border="0" alt="NikitaBlack" /> </div>
<style type=text/css"> # aboutme_panel, # contact_panel, # dev_panel, # wishlist_panel, # visitors_panel, # messages_panel, # tagcloud_panel, #stickers_panel, # collect_panel, # room_panel, # rankings_panel, #cool_panel, # gallery_panel, # friends_panel, # video_panel, # rss_panel, # url_panel, # special_panel, # outfits_panel { width:900px !important; } #rightColumn { display:none !important; } </style>
<center>
|
| | | JadeMoon
Location : Finland
| Subject: Re: Need help with codes..... Mon Oct 17, 2016 7:04 pm | |
| Cool thanks. Now I just need to figure out how to upload it on Filedrive and add text and other stuff on it. I don't know what I'm supposed to do there. I'm new to this whole thing anyway so I have no earthly idea how to do all this... |
| | | Valoish
Role : Designer & Coder Location : New York City
| Subject: Re: Need help with codes..... Mon Oct 17, 2016 9:11 pm | |
| @NikitaBlack You're using Dynamic Div coding, so there is no need for external hosting sites like Filedrive. Just paste the code in your IMVU panel and edit each box from within the code itself. c: One thing I did notice missing from your layout code is the Image Map itself. You have the image map referenced in your code as "usemap="#ImageMap1" but there is no actual image map in the code. If you look back at our Dynamic Div tutorial you'll notice that right under the area where the layout image goes, theres a map called "ImageMap1" and it has a bunch of links and coordinates in it. You'll need to add that part into your current code, and use an online mapping site to get the coordinates for each button |
| | | Pantone
Role : Designer & Coder Location : Indianapolis, IN, USA
| Subject: Re: Need help with codes..... Tue Oct 18, 2016 9:34 am | |
| ^ Seconding what Val said.
And we're here for you, that's what the forum is all about: learning.
We are here and happy to hlp you out. ^^ |
| | | JadeMoon
Location : Finland
| Subject: Re: Need help with codes..... Tue Oct 18, 2016 7:54 pm | |
| @Valoish Just added the image map thing, but I think the coordinating, or something else, is wrong because the text is under everything not inside the mainbox itself :/ |
| | | Valoish
Role : Designer & Coder Location : New York City
| | | | Sponsored content
| | | | |
| Permissions in this forum: | You cannot reply to topics in this forum
| |
| |
| |