HTML5 Block Link - rollover highlight?

Any way to add to Walter’s HTML5 Block Link action in order to change the background colour on rollover?


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

You can certainly use it to assist with this but some extra css is required.

Have a look at http://deltadesign.co/FW7Test/tabs-with-morecss.html

The blue/lilac box uses Walters Block link action and then in the action inteface I have added the class of hover

Then in Page>Html Markup I have used the following CSS

 a.hover div:hover {
background-color: yellow !important;
}

What this says is that any link ( a ) with the class of hover (a.hover) and has a div inside it should turn yellow when rolled over (div:hover)

David


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

Dave,

this looks like it will do the trick!

Trying to find my way here, do I add it as a ‘style’ attribute? I’ve tried pasting it into markup, before and after html, but the text just shows up on the page. :frowning: (“Any link (a)” ? )

(How of you guys learn this stuff? I spend ages googling like a loony and can’t make head nor tail of anything I find. … Makes photography seem as simple as pressing a button … 'oh, wait a minute. It is! (Apparently … sigh).


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

[Laughs] By doing.

And asking a lot of questions. And reading everything. With a shocking amount of trial-and-error too. It ain’t pretty.

Todd
http://xiiro.com http://xiiro.com/

(How of you guys learn this stuff?


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

Do not discount loony googling… it pays off eventually.


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

Wrap it in some style tags and paste it into Page>Html Markup in the before end section

<style type="text/css">
 a.hover div:hover {
background-color: yellow !important;
}
</style>

And definitely by reading all you can turn up with Google and of course there is a bucket load of stuff here too!

D


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

Here are my thoughts…

http://cssway.thebigerns.com/workbench/grant-html5-block-link-styling/


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

That’s pretty damned cool Ernie.

It also gives me a great insight into where I can use FW’s styles to save a lot of time.

It also explains a lot about how tags work.

It also made me read and understand why em is better than px … which begs the question … why are people (Softpress) still using px?

Thanks!


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

Freeway was (and is, mostly) a DTP application, with its feet firmly mired in the fixed document layout geometry of that realm. Relative dimensions are fuzzy and imprecise, and don’t map neatly to the rigid x/y of DTP. Freeway has been studiously ridding itself of these legacy leanings, but it has a long way to go.

Walter

On Dec 5, 2014, at 12:32 PM, grantsymon email@hidden wrote:

That’s pretty damned cool Ernie.

It also gives me a great insight into where I can use FW’s styles to save a lot of time.

It also explains a lot about how tags work.

It also made me read and understand why em is better than px … which begs the question … why are people (Softpress) still using px?

Thanks!


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

Thanks for the explanation Walter.

Drag is … In FW I can’t pad a block with em. If I try, it defaults to px. So anyone looking at my site and increasing their magnification is going to get weird behaviour. On the other hand … anyone using Windows, is in for their old 96dpi anyway … or am I misunderstanding how browsers work in this sense?


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

While SP is still adding in some of these popular units, there is a handy
work-around that I use that suits me…

First – and you may have to search for it because I don’t want to rehash
it every time it comes up – I use the trick of applying the
font-size:62.5% property/value to the body or html element. Essentially,
this makes 1em equal 10px. This makes it easy for me to know that 16px
would equal 1.6em, and so on.

When I set a font in Freeway, I’ll set Freeway’s style in px then override
it with the font-size property in em. In the workspace, Freeway uses the px
measurement – but when it generates the page code, it uses the em
definition. This keeps FW in better sync between workspace and output.

Besides font sizes, I usually use ems for padding and sometimes margins.
When extending styles for an item, it helps to write the same code Freeway
does (it notoriously avoids CSS shorthand norms) else you can generate
confusing code.

The benefit is your page code is generated exactly as you want it. The
drawback, of course, is if you change a font size or a padding/margin
amount then you must remember to change the extended amount as it will
always override the “normal” setting.


Grant - you can extend an html box (menu Item > Extended) Choose the DIV
STYLE tab then add the property and Value (name) pairs like in the Style
Editor extended window. Be sure to mimic how Freeway writes the Padding
property so it will replace its px value with your em one.


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