[Pro] Is there a way...

Hover over the email text top left note the text turns black but not the icon is there a way to connect the two? I know I can use an image but…

CHEERS!

http://easthalldesign.com/dev4/


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I know I can use an image but…

You mean a Rollover Image.

The way I would do this is to add the icon as a background via CSS and change tha hover state to replace the Icon with a black one (if you were clever you would use a Sprite). In a similar way this page has the icons added in the fields via CSS http://www.deltadesign.co/formtest2.html

No rollover on that example but…

Alternatively you could use an Icon font.

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I’m afraid that I’m not so hip to the lingo… is a sprite where you’d have
both versions of the icon in one image, but set the image positioning so
you only see the one you want depending on the user action? Or is it
something different?


Ernie Simpson

On Tue, Nov 6, 2012 at 3:04 PM, DeltaDave email@hidden wrote:

I know I can use an image but…

You mean a Rollover Image.

The way I would do this is to add the icon as a background via CSS and
change tha hover state to replace the Icon with a black one (if you were
clever you would use a Sprite). In a similar way this page has the icons
added in the fields via CSS http://www.deltadesign.co/formtest2.html

No rollover on that example but…

Alternatively you could use an Icon font.

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Yes I believe thats correct ‘sprite sheets’ I have actually created for developers before but never known how to add to a website - I have seen Walter demo how to do it somewhere though…


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Dave ! But I don’t how to do that! I keep looking cheers


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

With a little bit of hand code it is possible in Freeway: CSS Image Sprites


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

And heres the demo in Freeway - Home

But still none the wiser!! Cheers!


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

And for making my icon turn black when I rollover the text seems like a heck of a lot of work!


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Everything is hardest the first time.

I worked with this method in Freeway Pro YEARS ago, before it was called sprites. It has the great advantage of loading once Instead of many times, when used for all ur icons.


Ernie Simpson

On Nov 6, 2012, at 5:58 PM, “Justin Easthall” email@hidden wrote:

And for making my icon turn black when I rollover the text seems like a heck of a lot of work!


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

For sure, one day Ill give it a go for sure -


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

And for making my icon turn black when I rollover the text seems like a heck of a lot of work!

I did suggest an Icon font as an alternative. There are plenty of free ones that you could use the same way as using FontFace or WebFonts.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Yeah I did look at that thanks - It seemed complicated. Look at these http://fortawesome.github.com/Font-Awesome/

2.0 has the same email icon I use - but when I looked at adding it - at the bottom of the page, I was at a lost


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

OK - another method which you should find easier. Using the CSS Menu action

http://www.deltadesign.co/fw_examples/CSSstuff/image-inlink.html

I suspect you will want to use transparent Pngs for your images.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Good idea cheers!


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Wooops! - Got my black and orange round the wrong way.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

No worries!?
I looked at your website - but its just a holding page? Right?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Not for show - all under the hood!


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

What - like requests only??


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Here is another example that uses FontFace to display a web font for the envelope

http://www.deltadesign.co/fw_examples/CSSstuff/more-font-face.html

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Great is that easy to do?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options