[Pro] Possible CSS Trick???

Is this possible to do this in freeway??? http://css-tricks.com/examples/SlideupBoxes/#


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

Yes - but not without additional markup http://www.deltadesign.co/andends/slide_up_boxes.html

David


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

Okay so the additional markup, I know I create the style for the item and use the different things in there in extended. So if I entered everything into the extended area just as it is in the style section of the css would that work? or would I need to edit it in different ways for it to correctly work? Example If the box rolls over to a new picture does that other picture need to be placed behind that box or what? Please let me know if none of this makes any sense, as I am new to this and not sure how to do all of this.


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

There’s lots of different ways to get extra CSS into a Freeway page.
You can use the Page / HTML Markup dialog, and just code it all by
hand in the Before /head section. You can use the Style palette and
the Extended button there to add big chunks of hand-made rules to your
styles. Or you can use a proper CSS editor like CSSEdit, and the
External Stylesheet Action.

Walter

On Sep 7, 2011, at 10:26 PM, Nate wrote:

Okay so the additional markup, I know I create the style for the
item and use the different things in there in extended. So if I
entered everything into the extended area just as it is in the style
section of the css would that work? or would I need to edit it in
different ways for it to correctly work? Example If the box rolls
over to a new picture does that other picture need to be placed
behind that box or what? Please let me know if none of this makes
any sense, as I am new to this and not sure how to do all of this.


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

I understand, thank you. I also pulled this up in internet explorer and it did not work. Is there any way I can get it to work in internet explorer.


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

IE is not going to support this until version 10 at a minimum. IE 9
supports a fair amount of CSS3, but not any of the transform stuff.
You could shim it with JavaScript, so that if the effect isn’t
supported natively, the JavaScript would take over. Shades of 1997,
and browser-sniffing to determine whether you would serve up a site
with layers (Netscape) or tables (everything else).

You need to ask yourself, seriously, whether the effect is important
enough to your core design and message to make it universal (with all
the engineering effort you’re going to need to undertake just to shore
up a lagging browser or three) or if this is the “candy” sprinkled on
top, and those who don’t get it are simply missing out a little bit. I
could imagine setting this layout up so that if you didn’t have the
transform capability, you would simply see the button in a state where
it showed both states at the same time. Think about this like you
would an Accordion effect when the browser has disabled JavaScript: if
you’ve done your job properly, they can still read all of the headers
and blurbs, because everything is open and revealed by default.

Walter

On Sep 8, 2011, at 9:19 AM, Nate wrote:

I understand, thank you. I also pulled this up in internet explorer
and it did not work. Is there any way I can get it to work in
internet explorer.


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

Okay thank you. If I were to try and insert the action using the new style and then extended, what parts of the css do I need to insert in order to make the action work correctly? Also I see your point and I was trying ot fugre out how to make it work to where you can at least see somethineg in IE. Do you have any ideas on how to do that?


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

I haven’t looked at the code for your effect in any depth. But the
trick I would use is to use the effect to hide the effect. That way it
can’t possibly hide the disclosed element from IE.

In JavaScript, you would do something like this:

$('foo').hide();
$('bar').observe('mouseover',
	function(){
		$('foo').show();
	}
);

The idea is that you use JavaScript to hide the element, thereby
ensuring that anyone who has JavaScript disabled will always see the
element. If you had used CSS to hide the element:

<div id="foo" style="display:none"> ... </div>

Then someone who had JS disabled would simply never see that hidden
element, since there’s no good way to disable CSS hiding in the
absence of JavaScript.

So in your example, if your effect is to disclose an element with a
CSS transform, set the default of that element to hide using a
transform and a duration of 0. Only a browser that can manage a
transform will follow that rule, any other browser will simply ignore
it. So the hidden element will be disclosed by default.

Now in the case of the example you showed, you would need to design
the effect a little differently, since having the hidden part
disclosed would cover the caption. So maybe your effect should be to
have the transform disclose the hidden information below the caption,
like this:

Where I work:
Walter Davis Studio

Rather than covering up Where I work.

Walter

On Sep 8, 2011, at 11:57 AM, Nate wrote:

Okay thank you. If I were to try and insert the action using the new
style and then extended, what parts of the css do I need to insert
in order to make the action work correctly? Also I see your point
and I was trying ot fugre out how to make it work to where you can
at least see somethineg in IE. Do you have any ideas on how to do
that?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
List Options | FreewayTalk


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