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 1424 registered users
The newest registered user is Virtualdoll

Our users have posted a total of 2565 messages in 156 subjects
Canvas Time
Share | 
 

 Transition Buttons: iFrame

View previous topic View next topic Go down 
Go to page : Previous  1, 2, 3
AvaABlake

avatar
View user profile

PostSubject: Re: Transition Buttons: iFrame Mon Jun 01, 2015 5:35 pm

Thank you Pantone :3

__________________________________
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 Jun 01, 2015 5:39 pm

My pleasure!

As I am at work and my flash drives are at home, I went to Google to find something instead.
So, I found this explanation and coding - it looks fairly simple, but when I get home I can see if I can find the one one of our
older staff members wrote before they retired!

Let me know if that explanation worked - I will aim to re-publish/re-write the tutorial soon!

__________________________________
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 Tue Jun 02, 2015 3:53 pm

The way I do it is I add a background to the button, and the make the measurements (width and height) match the original image's measurements.
All I add to the unhovered CSS is:

Code:
background-image: url(unhovered button image link);
background-repeat: no-repeat;
And to the hovered CSS:
Code:
background-image: url(hovered button image link);
background-repeat: no-repeat;

__________________________________
CanvasTutorials
ADMIN


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

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 Tue Jun 02, 2015 5:25 pm

^ Thank you Val!
We got to get that one back up in thread form. ^_^

__________________________________
CanvasTutorials
ADMIN

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

avatar
View user profile

PostSubject: Re: Transition Buttons: iFrame Tue Jun 02, 2015 8:11 pm

Thank you :3 I'll be testing this out

__________________________________
Back to top Go down
AvaABlake

avatar
View user profile

PostSubject: Re: Transition Buttons: iFrame Wed Jun 03, 2015 8:38 pm

So what I wanted to do was a combination of image transition links and text transition links. But so far, all I've been able to do are the image links. And no matter what I do, I can't seem to position them where I want to.

Edit:

This is how I want to position them:


__________________________________
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 Thu Jun 04, 2015 5:33 pm

Could you send me the code?
And you can easily do both image and text links c: Just keep the premade CSS we have now, and just add the image background CSS I posted earlier to it o;

__________________________________
CanvasTutorials
ADMIN


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

Back to top Go down
AvaABlake

avatar
View user profile

PostSubject: Re: Transition Buttons: iFrame Thu Jun 04, 2015 7:23 pm

xD Nevermind, I got it now. I just forgot to add selectors to my CSS :p9:

__________________________________
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 Fri Jan 08, 2016 2:44 am

Okay,

Got the hover to work and the buttons are clicking. (YAY!)
How do I get it to go horizontal? - I tried the "inline-table", and
just "inline" and nothing changed.

Halp?
@Kya / @Nickolas / @IKumaI

__________________________________
CanvasTutorials
ADMIN

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

avatar
View user profile
Role : Designer & Coder
Location : Kingdom Hearts
http://redbubble.com/people/kaizaoda

PostSubject: Re: Transition Buttons: iFrame Fri Jan 08, 2016 12:38 pm

Haha, this is late but the way I do it is newbie... I make multiple of the same set.

EXAMPLE {CLICKY}:
 

(this always gives me 2 sets of style sheets {1 for nav buttons & 1 for main stuff like body/h1/h2 etc.} lol).
Since I was having problems with IMVU and the inline-table thing.
Back to top Go down
Raavein

avatar
View user profile
Role : Designer & Coder
Location : OK

PostSubject: Re: Transition Buttons: iFrame Thu Aug 11, 2016 9:26 am

Perf. *D* I feel so dumb, I forgot to put "target="inlineframe"" after the link, hah. But, I figured it out. :3

__________________________________
Moderator
Semi-Hiatus, Please message/tag another moderator for a prompter response. Thank you!
My Status Thread.

My Timezone: CT / Central
Back to top Go down
 
Transition Buttons: iFrame
View previous topic View next topic Back to top 
Page 3 of 3Go to page : Previous  1, 2, 3

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