HomeHome  SearchSearch  Rules & Guidelines  Staff List  MemberlistMemberlist  RegisterRegister  Log inLog in  
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!

Staff
Staff Updates
Important Links
Statistics
We have 1428 registered users
The newest registered user is zZbannyezZ

Our users have posted a total of 2569 messages in 157 subjects
Canvas Time
Share | 
 

 Transition Buttons: iFrame

View previous topic View next topic Go down 
Go to page : 1, 2, 3  Next
Nickolas

avatar
View user profile
Role : Designer & Coder
Location : Somewhere
http://niq-olas.com/

PostSubject: Transition Buttons: iFrame Mon Feb 18, 2013 5:49 am




F.A.Q:
Back to top Go down
Nickolas

avatar
View user profile
Role : Designer & Coder
Location : Somewhere
http://niq-olas.com/

PostSubject: Re: Transition Buttons: iFrame Fri Oct 18, 2013 7:26 pm


__________________________________


If you have any questions or suggestions how to improve our forum & if you have any complains feel free to send me an pm here or via imvu.
My Website Shop

Back to top Go down
Nickolas

avatar
View user profile
Role : Designer & Coder
Location : Somewhere
http://niq-olas.com/

PostSubject: Re: Transition Buttons: iFrame Fri Oct 18, 2013 7:27 pm

Please if you have any troubles with this tutorial.Leave a comment/post it. And if you have done some layout designs. Please show me. Smile

__________________________________


If you have any questions or suggestions how to improve our forum & if you have any complains feel free to send me an pm here or via imvu.
My Website Shop

Back to top Go down
The author of this message was banned from the forum - See the message
Valoish

avatar
View user profile
Role : Designer & Coder
Location : New York City
http://kyaimvu.deviantart.com

PostSubject: Re: Transition Buttons: iFrame Fri Oct 18, 2013 8:12 pm

The tutorial will only have the ones that are up on the Dynamic Div Transition Tutorial.
If you wish to try new styles, you could message either Blau or Myself and we'll help guide through the process. c:

__________________________________
CanvasTutorials
ADMIN


Technician | Theft Council | Forum Design
"Love Truth and Pardon Error."

Back to top Go down
The author of this message was banned from the forum - See the message
Nickolas

avatar
View user profile
Role : Designer & Coder
Location : Somewhere
http://niq-olas.com/

PostSubject: Re: Transition Buttons: iFrame Sat Oct 19, 2013 6:03 am

Link available. I will open new thread for all effects i know so far and changing then into horizontal menu.

__________________________________


If you have any questions or suggestions how to improve our forum & if you have any complains feel free to send me an pm here or via imvu.
My Website Shop

Back to top Go down
The author of this message was banned from the forum - See the message
Nickolas

avatar
View user profile
Role : Designer & Coder
Location : Somewhere
http://niq-olas.com/

PostSubject: Re: Transition Buttons: iFrame Sat Oct 19, 2013 6:24 am

Animals wrote:
where would the things for the links go? ;o like at the bottom of the coding, top or center?o3o
Where ever you want. But my suggestion is under the boxes. It will be cleaner.

__________________________________


If you have any questions or suggestions how to improve our forum & if you have any complains feel free to send me an pm here or via imvu.
My Website Shop

Back to top Go down
The author of this message was banned from the forum - See the message
Nickolas

avatar
View user profile
Role : Designer & Coder
Location : Somewhere
http://niq-olas.com/

PostSubject: Re: Transition Buttons: iFrame Sat Oct 19, 2013 6:31 am

Animals wrote:
Ok 1 more question for now.

Would these work on tabs that's already created on the layout?;o
or should we not make tabs on the layout?o3o
How you mean exactly? Surprised

__________________________________


If you have any questions or suggestions how to improve our forum & if you have any complains feel free to send me an pm here or via imvu.
My Website Shop

Back to top Go down
The author of this message was banned from the forum - See the message
Nickolas

avatar
View user profile
Role : Designer & Coder
Location : Somewhere
http://niq-olas.com/

PostSubject: Re: Transition Buttons: iFrame Sat Oct 19, 2013 6:45 am

If you did read my post. Scroll it up a bit. You can see i will open new thread for new effects and hot to do Horizontal menu.

__________________________________


If you have any questions or suggestions how to improve our forum & if you have any complains feel free to send me an pm here or via imvu.
My Website Shop

Back to top Go down
The author of this message was banned from the forum - See the message
The author of this message was banned from the forum - See the message
Nickolas

avatar
View user profile
Role : Designer & Coder
Location : Somewhere
http://niq-olas.com/

PostSubject: Re: Transition Buttons: iFrame Sun Oct 20, 2013 6:13 am

I'll see what's the problem.

__________________________________


If you have any questions or suggestions how to improve our forum & if you have any complains feel free to send me an pm here or via imvu.
My Website Shop

Back to top Go down
Nickolas

avatar
View user profile
Role : Designer & Coder
Location : Somewhere
http://niq-olas.com/

PostSubject: Re: Transition Buttons: iFrame Sun Oct 20, 2013 6:22 am

You still have to do Left and Right position for navigation. Same like you would do dp or any other box http://i.imgur.com/stnQeEO.png


Code:
<font face="verdana" size="1" color="black">

<img src="http://i39.tinypic.com/2pqm91v.png" width="900" height="600" border="0" usemap="#ImageMap">

<map id="ImageMap" name="ImageMap">
<area shape="rect"  coords="58,55,85,73" href="http://www.imvu.com/catalog/web_add_contact.php?contact=Cares" target="" />
<area shape="rect"  coords="119,54,145,74" href="javascript:IMVU.messagePopupShow({force_recipient_id:34879489})" target="" />
<area shape="rect"  coords="179,55,205,74" href="imvu:StartIM?avatar=Cares&fromSite=1" target="" />
</map>

<div id="NAV">
  <a href="http://vocalsimvu.webs.com/Careys%20Layout%20/About.html" target="ID"> Homepage </a>
  <a href="#" target="ID"> About Me </a>
  <a href="#" target="ID"> Friends </a>
  <a href="#" target="ID"> Love </a>
<a href="#" target="ID"> Gallery </a>
<a href="#" target="ID"> Support </a>
</div>

<div id="avi_box" style="width:160px; height:220px; position:absolute; left:51px; top: 106px; z-index:1">
<img src="http://www.imvu.com/catalog/web_av_pic.php?av=Cares" width="160px" height="220px" border="0" alt="Cares" />
</div>

<div id="Updates_box" style="width:292px; height:212px; position:absolute; left:249px; top:110px; z-index:1; overflow:hidden;">
<iframe src="Updates_URL_GOES_HERE" name="Updates" width="292" height="212" border="0" marginwidth=0 marginheight=0 frameborder=0 allowtransparency="true scrolling="no"></iframe>

<div id="Music_box" style="width:322px; height:214px; position:absolute; left:547px; top:109px; z-index:1; overflow:hidden;">
<iframe src="Music_URL_GOES_HERE" name="Music" width="322" height="214" border="0" marginwidth=0 marginheight=0 frameborder=0 allowtransparency="true scrolling="no"></iframe>
</div>

<div id="main_box" style="width:620px; height:212px; position:absolute; left:249px; top:366px; z-index:1; overflow:hidden;">
<iframe src="http://vocalsimvu.webs.com/Careys%20Layout%20/About.html" name="ID" width="620" height="212" border="0" marginwidth=0 marginheight=0 frameborder=0 allowtransparency="true scrolling="no"></iframe>




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

<style type="text/css">
.paneltitle, .panelmenu, .imvucodes_net { display:none !important; }
</style>
</font>

<style type="text/css">
#NAV{
  width:200;
  left:30px;
  top:380px;
  text-align:center;
  position:absolute;
}

#NAV a:link, #NAV a:visited, #NAV a:active{
  display:block;
  width:200px;
  padding:10px 0px;
  background-color:#0d0d0d;
  color:#FFF;
  text-align:center;
  text-decoration:none;
  font-family:Arial;
  font-size:10px;
  margin:2px 0px;

  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease
}

#NAV a:hover{
  color:#B6E87C;
}

</style>

__________________________________


If you have any questions or suggestions how to improve our forum & if you have any complains feel free to send me an pm here or via imvu.
My Website Shop

Back to top Go down
The author of this message was banned from the forum - See the message
The author of this message was banned from the forum - See the message
Nickolas

avatar
View user profile
Role : Designer & Coder
Location : Somewhere
http://niq-olas.com/

PostSubject: Re: Transition Buttons: iFrame Sun Oct 20, 2013 3:32 pm

Animals wrote:
Since you wanna see our final thingy we do with the tut. http://www.imvu.com/catalog/web_mypage.php?user=34879489 c8
Damn. Good job :DDDD

__________________________________


If you have any questions or suggestions how to improve our forum & if you have any complains feel free to send me an pm here or via imvu.
My Website Shop

Back to top Go down
The author of this message was banned from the forum - See the message
Guest
Guest
avatar

PostSubject: Re: Transition Buttons: iFrame Mon Jan 06, 2014 1:54 pm

on:

<div id="NAV">
  <a href="#" target="ID"> HOMEPAGE </a>
blah blah..


on "id" i am confused with this part.  :bounce: 

and something more, in simple iframe layouts, we are using image map right?
on transition buttons how can i find the right position there?

sorry for being silly with all this:P
Back to top Go down
Pantone

avatar
View user profile
Role : Designer & Coder
Location : Indianapolis, IN, USA
http://pantonedoesgraphics.tumblr.com/

PostSubject: Re: Transition Buttons: iFrame Mon Jan 06, 2014 2:47 pm

Loquev wrote:
on:

<div id="NAV">
  <a href="#" target="ID"> HOMEPAGE </a>
blah blah..


on "id" i am confused with this part.  :bounce: 

and something more, in simple iframe layouts, we are using image map right?
on transition buttons how can i find the right position there?

sorry for being silly with all this:P

Now, I am not the expert with this particular coding, but I will attempt to
answer until another mod is available. - The "ID", I believe, is just classifying where
the CSS is to be applied to. You could use any name like "Bubbles" as long as the
NAME and ID name match.

It's kind of like when you have to name the ImageMap1 parts, and they have to be the same.
I think. Lol.

__________________________________
CanvasTutorials
ADMIN

Human Resources │ Account Activation │ Ban Control
"May the Force be with you."
Back to top Go down
Valoish

avatar
View user profile
Role : Designer & Coder
Location : New York City
http://kyaimvu.deviantart.com

PostSubject: Re: Transition Buttons: iFrame Mon Jan 06, 2014 3:02 pm

iHae wrote:
Loquev wrote:
on:

<div id="NAV">
  <a href="#" target="ID"> HOMEPAGE </a>
blah blah..


on "id" i am confused with this part.  :bounce: 

and something more, in simple iframe layouts, we are using image map right?
on transition buttons how can i find the right position there?

sorry for being silly with all this:P

Now, I am not the expert with this particular coding, but I will attempt to
answer until another mod is available. - The "ID", I believe, is just classifying where
the CSS is to be applied to. You could use any name like "Bubbles" as long as the
NAME and ID name match.

It's kind of like when you have to name the ImageMap1 parts, and they have to be the same.
I think. Lol.

The Div ID 'Nav' is what the menu's attributes are, and it matches with the name given in the CSS. c: Its best not to change JUST the div ID without changing it in the CSS as well.

You dont need to find the coordinates for a hover menu. They coordinate on their own c: All you need to do is position the div box so its located where you want the menu to be.

__________________________________
CanvasTutorials
ADMIN


Technician | Theft Council | Forum Design
"Love Truth and Pardon Error."

Back to top Go down
Guest
Guest
avatar

PostSubject: Re: Transition Buttons: iFrame Tue Jan 07, 2014 5:26 am

thank you  :| 
still don't understand but i will try
Back to top Go down
 
Transition Buttons: iFrame
View previous topic View next topic Back to top 
Page 1 of 3Go to page : 1, 2, 3  Next

Permissions in this forum:You cannot reply to topics in this forum
 :: HBAD REALM :: HBAD • Coding-
Jump to: