Hi Sue,
If you don’t mind rolling up your sleeves a bit there’s an example of a sliding captions gallery I put together a while ago over on the FreewayStyle site that you can play with; http://www.freewaystyle.com/sliding-captions
Regards,
Tim.
On 16 May 2012, at 14:17, sue wrote:
I want to do this on my web site (images grid) see link
If you don’t mind rolling up your sleeves a bit there’s an example of a sliding captions gallery I put together a while ago over on the FreewayStyle site that you can play with; http://www.freewaystyle.com/sliding-captions
OK, so how does it do its thing? I was looking for actions, rollovers or whatever and there appears to be none. Clearly there is some magic going on but I don’t know where to look for it. Any clues on where to start?
I haven’t tested or documented this yet, so I can’t make it available for
download… yet. Give it a spin while I take a nap and we can discuss it
later today.
I haven’t tested or documented this yet, so I can’t make it available for
download… yet. Give it a spin while I take a nap and we can discuss it
later today.
Hi Kim,
All CSS, no JavaScript, no Actions. I looks like Ernie is going to save me a job in explaining how you can set this up in Freeway.
Regards,
Tim.
On 17 May 2012, at 00:23, Kim Kohen wrote:
OK, so how does it do its thing? I was looking for actions, rollovers or whatever and there appears to be none. Clearly there is some magic going on but I don’t know where to look for it. Any clues on where to start?
That is beautiful! So nice to be in the company of briliance! Thank you for
your time and efforts!
Cheers,
Carol
On Thu, May 17, 2012 at 6:01 AM, Ernie Simpson email@hidden wrote:
I haven’t tested or documented this yet, so I can’t make it available for
download… yet. Give it a spin while I take a nap and we can discuss it
later today.
This is really cool, Ernie. How well does it degrade for the great unwashed (non-WebKit/standards browsers)?
Walter
On May 17, 2012, at 6:01 AM, Ernie Simpson wrote:
I haven’t tested or documented this yet, so I can’t make it available for
download… yet. Give it a spin while I take a nap and we can discuss it
later today.
No question this looks really good, but I have just run your site in Adobe’s Browser Lab, Ernie, and it breaks in IE6, 7 and 8. OK in IE9. When I say break I mean the text of the hidden sliding captions (not the transparent blocks) appear over the actual images on the screenshot Browser Lab takes.
I downloaded your Freeway sample file, Tim, and uploaded that and tested in Browser Lab, and that appears OK, but of course because all Browser Lab does is take a screenshot of the static site, I can’t fully test the functionality, so maybe it is OK on a live PC?
Hi Jonathan,
The transitions are handled by CSS and are supported in most modern browsers by way of a set of browser specific styles. For older browsers that don’t support all of this transition loveliness the overlay panels will just snap into place rather than glide. Personally I don’t think this is a major drawback as the core functionality is retained and the overlay content can still be seen.
Regards,
Tim.
On 17 May 2012, at 17:00, Jonathan Riddle wrote:
I downloaded your Freeway sample file, Tim, and uploaded that and tested in Browser Lab, and that appears OK, but of course because all Browser Lab does is take a screenshot of the static site, I can’t fully test the functionality, so maybe it is OK on a live PC?
Not sure if you use Adobe Browser Lab, but it basically allows you to enter the url of any site so you can preview in all browsers, but all it can do is take a screenshot of what it sees when it first visits the page - you can’t actually test any functionality.
In IE6, 7 and 8 - the screenshot shows the captions already in place over the images in Earls version, which makes me wonder whether they are already there before the visitor even makes a movement of the mouse. I would also accept the transitions not being smooth across all browsers, but of course if the captions are permanantly in place, that is more of a problem, but not something I can test properly.
That’s a good point Walter… I honestly haven’t given any thought to that
yet.
Vendor prefixes guarantee it will fail CSS validation, but it passes
structurally and even looks good semantically, considering it’s a visual
layout.
Someone asked the group awhile back about this type of boxy, revealing
layout. I had been thinking of using the :before and :after pseudo classes
because of another project I’m working on… (wink). I had been inspired by
what I had seen in this article:
But trying to reduce it all to work in Freeway Pro was a bit of a struggle.
When Tim shared his work on the subject, it gave me some practical ideas
for making a more ‘Freeway-friendly’ solution. At that point the ideas
started coming faster than I could keep up with.
But your point is still the big elephant in the room – hopefully I will
find the motivation to improve on this.
–
Ernie Simpson
On Thu, May 17, 2012 at 8:52 AM, Walter Lee Davis email@hiddenwrote:
This is really cool, Ernie. How well does it degrade for the great
unwashed (non-WebKit/standards browsers)?
On May 17, 2012, at 3:05 AM, Trevor Reaveley wrote:
Ernie, love it!
On 17 May 2012, at 11:01, Ernie Simpson wrote:
I haven’t tested or documented this yet, so I can’t make it available for
download… yet. Give it a spin while I take a nap and we can discuss it
later today.