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
|
| | |
CanvasInc
| Subject: Dynamic DIV Homepage Tue Aug 14, 2012 6:18 am | |
| Welcome to the Dynamic DIV Homepage tutorial! Below will be the coding, the video instructions and a complimentary FAQ in case anything is unclear. Like it has been said before, if you have any questions or something is malfunctioning - please ask it. Use this thread as your blank canvas and ask any and all questions you can come up with. We hope you enjoy the tutorial! As well - if you liked the tutorial or want us to fix something, review it and let us know how it worked for you.
Please note that this code isn't set up of one specifiec browser, after installing the coding on to your homepage you may need to add pixels to the top and/or left coordinates. This is not a universal code that works well with all browsers.
Questions That Have Come Up:
Reviews: |
| | | CanvasInc
| Subject: Re: Dynamic DIV Homepage Tue Aug 14, 2012 6:22 am | |
| Video Instructions: Click Here Installation Instructions: Click Here
The Base Coding: - Code:
-
<script> function changeNavigation(id) {document.getElementById('mainbox'). innerHTML=document.getElementById(id). innerHTML} </script> <img style="float:center:" src="IMAGE_LINK" usemap="#ImageMap1">
<map id="ImageMap1" name="ImageMap1"> <area shape="rect" coords="000,000,000,000" id="1b" onClick="changeNavigation('Home')"> <area shape="rect" coords="000,000,000,000" id="2b" onClick="changeNavigation('About')"> <area shape="rect" coords="000,000,000,000" id="3b" onClick="changeNavigation('Love')"> <area shape="rect" coords="000,000,000,000" id="4b" onClick="changeNavigation('Friends')"> <area shape="rect" coords="000,000,000,000" id="5b" onClick="changeNavigation('Gallery')"> <area shape="rect" coords="000,000,000,000" id="6b" onClick="changeNavigation('Support')"> <area shape="rect" coords="000,000,000,000" id="7b" onClick="changeNavigation('FAQ')"> </map>
<div id="mainbox" style="position:absolute; left:227px; top:161px; width:414px; height:174px; overflow: auto; border:0px; background-color:transparent; color:#000000;"> <center> <font face="verdana" size="1" color="white"> This tab will feature the same text found in your " Home " tab. </font></center> </div>
<div id="Home" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [Home] </font></center> </div>
<div id="About" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [About] </font></center> </div>
<div id="Friends" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [Friends] </font></center> </div>
<div id="Love" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [Love] </font></center> </div>
<div id="Gallery" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [Gallery] </font></center> </div>
<div id="Support" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [Support] </font></center> </div>
<div id="FAQ" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [FAQ] </font></center> </div>
<div id="other_box" style="width:000px; height:000px; position:absolute; left:000px; top: 000px; z-index:1">
</div>
<div id="avi_box" style="width:160px; height:220px; position:absolute; left:000px; top: 000px; 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,
#streetteam_panel, #blog_panel, #video_panel_header,
#music_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> |
| | | CanvasInc
| | | | The author of this message was banned from the forum - See the message | Hermoso
Location : USA,TN
| Subject: About the coding Fri Jan 04, 2013 6:06 pm | |
| I run into this problem like almost EVERY time I finish coding a layout and I get where, not all the tabs are clickable and I refresh the page and preview it and I go back and I see if I find any careless errors I may have made maybe forgot to put something and it still doesn't solve the problem. How do I fix this?
When I go to paste the code into Custom HTML/CSS in my URL panel how come everything is out of place. Dp out of the box Text on the main div is not in the center like it should be products aren't scrolling in the box shoutout isn't in the box either. I have to go and fix the code myself before I send the code to the customer. Is this unavoidable like will I be doing this EVERY time like its normal or is there a way to fix this? |
| | | Nickolas
Role : Designer & Coder Location : Somewhere
| Subject: Re: Dynamic DIV Homepage Mon Jan 07, 2013 7:17 am | |
| - Hermoso wrote:
- I run into this problem like almost EVERY time I finish coding a layout and I get where,
not all the tabs are clickable and I refresh the page and preview it and I go back and I see if I find any careless errors I may have made maybe forgot to put something and it still doesn't solve the problem. How do I fix this?
When I go to paste the code into Custom HTML/CSS in my URL panel how come everything is out of place. Dp out of the box Text on the main div is not in the center like it should be products aren't scrolling in the box shoutout isn't in the box either. I have to go and fix the code myself before I send the code to the customer. Is this unavoidable like will I be doing this EVERY time like its normal or is there a way to fix this? Are you using Google Chrome or Mozzila Firefox? |
| | | CanvasInc
| Subject: Re: Dynamic DIV Homepage Mon Jan 07, 2013 2:20 pm | |
| - Hermoso wrote:
- I run into this problem like almost EVERY time I finish coding a layout and I get where,
not all the tabs are clickable and I refresh the page and preview it and I go back and I see if I find any careless errors I may have made maybe forgot to put something and it still doesn't solve the problem. How do I fix this?
When I go to paste the code into Custom HTML/CSS in my URL panel how come everything is out of place. Dp out of the box Text on the main div is not in the center like it should be products aren't scrolling in the box shoutout isn't in the box either. I have to go and fix the code myself before I send the code to the customer. Is this unavoidable like will I be doing this EVERY time like its normal or is there a way to fix this? Is it possible for you to mail us a sample of this coding? - Ana |
| | | Kill
| | | | Nickolas
Role : Designer & Coder Location : Somewhere
| | | | Kill
| Subject: Re: Dynamic DIV Homepage Wed Mar 06, 2013 8:56 pm | |
| Thanks. Also, where are you getting the "top" height from? I mean you say to use gimp and all but you don't exactly say where we should be reading these numbers. Thanks in advance! |
| | | Guest Guest
| Subject: Re: Dynamic DIV Homepage Wed Mar 06, 2013 9:01 pm | |
| - Kill wrote:
- Thanks. Also, where are you getting the "top" height from? I mean you say to use gimp and all but you don't exactly say where we should be reading these numbers. Thanks in advance!
in the tool box ;o |
| | | CookieEvermore
Location : New York City
| Subject: Re: Dynamic DIV Homepage Thu Mar 07, 2013 5:07 am | |
| - Kill wrote:
- Thanks. Also, where are you getting the "top" height from? I mean you say to use gimp and all but you don't exactly say where we should be reading these numbers. Thanks in advance!
xx |
| | | Guest Guest
| Subject: Re: Dynamic DIV Homepage Fri Jun 28, 2013 7:37 am | |
| - Hermoso wrote:
- I run into this problem like almost EVERY time I finish coding a layout and I get where,
not all the tabs are clickable and I refresh the page and preview it and I go back and I see if I find any careless errors I may have made maybe forgot to put something and it still doesn't solve the problem. How do I fix this?
When I go to paste the code into Custom HTML/CSS in my URL panel how come everything is out of place. Dp out of the box Text on the main div is not in the center like it should be products aren't scrolling in the box shoutout isn't in the box either. I have to go and fix the code myself before I send the code to the customer. Is this unavoidable like will I be doing this EVERY time like its normal or is there a way to fix this? I have this same problem. I use Google Chrome. and most times I can fix this problem myself but it is just aggravating to have to deal with it every time I try to code a layout. I have tried to use Online image map editor's to since I thought it's because of how I did the coords. |
| | | Guest Guest
| Subject: Re: Dynamic DIV Homepage Fri Jul 05, 2013 8:23 pm | |
| Whenever I made my profile everything comes out right but there's a blue outline all around the sides of my layout, I don't know if maybe it only does that because od my internet browser or if it's something else, I didn't change anything on the basic code other than add the things I needed to put in there place. Did I somehow mess up the code?
well I suppose it was just my internet explore browser, I've installed google chrome and the blue outline is gone ^-^ |
| | | haseovzla
| Subject: Re: Dynamic DIV Homepage Thu Jan 02, 2014 7:32 am | |
| my buttons are not clickable -.- here is the code i used - Code:
-
<script> function changeNavigation(id) {document.getElementById('mainbox'). innerHTML=document.getElementById(id). innerHTML} </script> <img style="float:center:" src="http://i.imgur.com/Z0ZcRWr.png" usemap="#ImageMap1">
<map id="ImageMap1" name="ImageMap1"> <area shape="rect" coords="96,145,151,165" id="1b" onClick="changeNavigation('Home')"> <area shape="rect" coords="225,145,306,165" id="2b" onClick="changeNavigation('About')"> <area shape="rect" coords="377,145,452,165" id="3b" onClick="changeNavigation('Friends')"> <area shape="rect" coords="520,145,605,165" id="4b" onClick="changeNavigation('Support')"> <area shape="rect" coords="682,145,794,165" id="5b" onClick="changeNavigation('Love')"> </map>
<div id="mainbox" style="position:absolute; left:216px; top:240px; width:570px; height:250px; overflow: auto; border:0px; background-color:transparent; color:#000000;"> <center> <font face="verdana" size="1" color="white"> This tab will feature the same text found in your " Home " tab. </font></center> </div>
<div id="Home" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [Home] </font></center> </div>
<div id="About" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [About] </font></center> </div>
<div id="Friends" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [Friends] </font></center> </div>
<div id="Support" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [Support] </font></center> </div>
<div id="Love" style="display:none"> <center> <font face="verdana" size="1" color="white"> DYNAMIC! [Love] </font></center> </div>
<div id="other_box" style="width:000px; height:000px; position:absolute; left:000px; top: 000px; z-index:1">
</div>
<div id="avi_box" style="width:160px; height:220px; position:absolute; left:000px; top: 000px; 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,
#streetteam_panel, #blog_panel, #video_panel_header,
#music_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> |
| | | Pantone
Role : Designer & Coder Location : Indianapolis, IN, USA
| | | | haseovzla
| Subject: Re: Dynamic DIV Homepage Thu Jan 02, 2014 9:01 am | |
| - iHae wrote:
- *Please keep in mind that posts here aren't the first we catch, and we apologize for that.
Please use the Request Help thread for further issues. Thanks!
EmileighAmethyst - Traditionally, it depends on browser. There are some "international" browser coding, but we haven't set a tutorial for that. Usually, the answer I give is to Preview the HP, or take orders based off what browser they use.
Perplexity - Another issue could of been the Panel's outline stroke. But I am glad you got it!
haseovzla - I am looking into the code now. Did you click "Preview" after you were done? o; thank you. it was my mistake :P sorry |
| | | Pantone
Role : Designer & Coder Location : Indianapolis, IN, USA
| | | | Coachella
Location : Rivendell
| | | | Pantone
Role : Designer & Coder Location : Indianapolis, IN, USA
| Subject: Re: Dynamic DIV Homepage Fri Jun 20, 2014 11:46 am | |
| Do you have your <center> tags turned on? For the layout image? o; |
| | | Guest Guest
| Subject: Re: Dynamic DIV Homepage Thu Aug 28, 2014 7:29 am | |
| Hello I had a question. I understand the code, but I wanted to know how do you add a button to something other then your main box. For example I have my main box with home friend and love. then I have my other box that says other but i want to add a button to that so i can add news. |
| | | Guest Guest
| | | | Guest Guest
| Subject: Re: Dynamic DIV Homepage Thu Mar 12, 2015 5:18 am | |
| i cant click my shop or support :/ so although my prods show here they do not on my page. Also yes I have tried using preview mode a few times idk what is wrong |
| | | Valoish
Role : Designer & Coder Location : New York City
| Subject: Re: Dynamic DIV Homepage Thu Mar 12, 2015 1:13 pm | |
| I'll take a look at the coding for you after I take my last midterm exam c: |
| | | Guest Guest
| | | | Guest Guest
| Subject: Re: Dynamic DIV Homepage Tue May 12, 2015 12:52 am | |
| was a really great help with most of the coding, my page is still under construction and still need to put in the diameters and more pics. |
| | | Sponsored content
| | | | |
Similar topics | |
|
| Permissions in this forum: | You cannot reply to topics in this forum
| |
| |
| |