logo-dw

Go Back   Dreamweaver Club Forums > Hand Coders Forum > Javascript and JS frameworks
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 05-09-2012, 01:27 AM   #1
tony09uk
 
Join Date: Oct 2010
Posts: 340
Default jquery text effect

I am trying to rotate a link a small amount when a user hovers over the link and also have that link at the same angle when that page is active. firstly is this a simple request and secondly can someone advise what commands I need to use, an example would be very helpful as I have very little idea with jquery.

I have looked around quite a bit now and tried a couple of ideas that seemed to miss the mark
tony09uk is offline   Reply With Quote
Old 05-09-2012, 01:52 PM   #2
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

Use CSS3 to tilt the text as much as you want.
http://css-tricks.com/snippets/css/text-rotation/

For your nav, set an ID on your active nav item, and apply the same style. No jQuery needed.
domedia is offline   Reply With Quote
Old 05-09-2012, 04:34 PM   #3
tony09uk
 
Join Date: Oct 2010
Posts: 340
Default

i looked at that but didnt want to use css3 cause i wanted it to be the same accross all browsers
tony09uk is offline   Reply With Quote
Old 05-09-2012, 06:14 PM   #4
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

There is no other way to skew text.. jQuery uses CSS to change the look of your content.

Just do it, and when someone makes a comment about their browser not being able to see it, just tell them that you web site is future proof, and that it will still work in their old browser, they just won;t see the cool effects
domedia is offline   Reply With Quote
Old 05-10-2012, 12:01 PM   #5
tony09uk
 
Join Date: Oct 2010
Posts: 340
Default

Okay in that case i could set a message for the older browsers advising them to upgrade.

Just one more question the text i am looking to rotate is in a div called nav. That along with everything above it and a few lines below it are then included using php. I want to be able to angle the link foe whatever page the user is on. How would you do it?

I have googled it but most come back with adding a class to the body tag but I cant see how to make this work as I will be including that under the same file as nav
tony09uk is offline   Reply With Quote
Old 05-16-2012, 08:42 PM   #6
gentleone
gentleone's Avatar
 
Join Date: Nov 2009
Location: Rhodes, Greece
Posts: 2,837
Default

Tony... just paste your code if you're talking about code... it's speeds up getting an answer to your question (well, in most cases )

You can give the link a class, can't you? Or lets do cool, cause you don't support older browsers with CSS transform anyway and use a CSS attribute selector to hook a style to that link.

Something along the line like this:
Code:
#nav a[href="page.php"] {
    transform: rotate(90deg);
}
I have to see the link in order to see which attribute selector you'll need. CSS3 has a few new handy ones too (http://www.ericfeminella.com/blog/20...ute-selectors/).

I've only used the W3C standard one for transform, but you know that you need to add the prefix ones as well. If you're going to use a lot of CSS3 in your projects, then I recommend to use prefix-free. It will automatically add the prefixes to your CSS properties.

Two other tools I use for progressive enhancement are modernizr and selectivzr.

I also stand by what Dom said... for little things or effects, don't create fallbacks for older browsers unless it is something really important for functionality, accessibility or readability.
__________________
www.gentlemedia.nl

Last edited by gentleone; 05-16-2012 at 11:08 PM.. Reason: fixed a link
gentleone is offline   Reply With Quote
Old 05-16-2012, 10:12 PM   #7
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

gentleone, some of your answers are like mini-tutorials. I feel like posting this to the home page
domedia is offline   Reply With Quote
Old 05-16-2012, 10:41 PM   #8
gentleone
gentleone's Avatar
 
Join Date: Nov 2009
Location: Rhodes, Greece
Posts: 2,837
Default

Quote:
Originally Posted by domedia View Post
gentleone, some of your answers are like mini-tutorials. I feel like posting this to the home page
Haha... well, before you do... it do need some proof reading
__________________
www.gentlemedia.nl
gentleone is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 09:41 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com