Clicky

Fancy Introduction To RapidWeaver
My Image

All the latest RapidWeaver Stacks reviewed,
plus the most important community news …

Stay up to date with current RapidWeaver developments

Fancy Introduction To RapidWeaver

Just a few days ago, I mentioned that the one time Tsooj Media stack, FancyIntro would soon be reclothed as a Stacks4Stacks product. Well, two days ago it flattered into my mailbox.
Of course, I immediately took out my magnifying glass and inspected it! During my inspection FancyIntro was updated, so this review took a little longer than expected.

Now if you were expecting FancyIntro to be a larger, more luxurious version of Curtains (think VW Passat/Phaeton), think again. FancyIntro is an entirely different stack. More of a Mercedes AMG.

Curtains can display a line of text and opens it's curtains horizontally. FancyIntro can display two lines of text, or two images – or one image plus a single line of text (or stacks content), and opens vertically. However, if you're expecting FancyIntro to open two curtains and reveal the underlying content, you'll be disappointed. Instead, a line travels across the page from left to right, dividing the upper and lower section, then expands vertically to create a coloured page overlay. The page overlay then fades out to reveal the underlying webpage.

Having just taken Curtains through its paces and expecting similar results, it took me a couple of minutes to work out exactly how FancyIntro works. However, once you've put away the curtain concept, FancyIntro is very easy to use.

The default setting displays a white to grey gradient and two lines of text. A mauve coloured line then travels across the page, expands to fill the page and then fades to reveal the content.
Both the initial background and the line have colour settings for top and bottom, so that the line can expand to a gradient too. Obviously, the gradients don't need to be so blatant as below.

FancyIntro
I soon tried dragging two 'halved' images into both the upper and lower content wells. In the latest version of FancyIntro this is possible (the 1.0 version duplicated the upper image). Of course, with an image in both sections, no accompanying text is possible. If images are to be present in both upper and lower containers, it is recommended that they are kept as small as possible. In fact an image size of max 150px is recommended by S4S.
SVG images can be loaded as warehoused images, but be warned – if you have stripped out the pixel sizes, they will scale to fill the screen width.

FancyIntro
Stack settings

General Settings
Overlay Fill Top/Bottom. Whilst the colour palette displays transparency settings, they are ignored by FancyIntro.
Line Fill Top/Bottom
Breakpoint. FancyIntro is hidden below the breakpoint.
Line Height. Set the height of the dividing line in %.
Start Delay
Line Slide Speed
Line Grow Speed
Fade Speed. All of the speed settings are in ms and would seem to be unlimited. Hence, with inappropriate settings, you could sit all day, waiting for the dividing line to travel across the page.
Challenge Mode. The same as Asynchronous Mode in Curtains.
Hide period. Sets a hide cookie for Days (default), or Hours.

Upper Content. Styled Content (default), Dropped Image, HTML, Markdown, None, Stacks, Warehoused Image.
Offset. In %
Text Colours. Text / Shadow
Text Sizing / Spacing
Text Alignment
Text Styling

Lower Content analogue to above.

FancyIntro is less gimmicky than Curtains and is ideal for splash screens that make way for an underlying web page. Announcements such as special offers, upcoming events, or just an attractive 'welcome' message.

blog comments powered by Disqus

Links to the developers ® All trademarks cited on this page are the property of their respective owners.

Subscribe to Ninja News
or ask a question

Hi, I’m the Ninja Bot. What’s your name?
image/svg+xml
Nice to meet you, [1-1]. Could you tell me your mail address?
image/svg+xml
[1-1], would you like to subscribe to the monthly Ninja Newsletter?

Yes, I would like to receive your monthly newsletter.

No thanks, I’m good for now. I have a different issue.

image/svg+xml
Thanks for your support, [1-1]. Is there anything else I can do for you?
image/svg+xml

[1-1], thanks for subscribing. If you made a further request, I’ll get back to you – typically within 24 hrs.

image/svg+xml
Name: [1-1] [1-2]
Email; [2]

Contacted you via the Siphon form at Ninja News.

I would like to subscribe to the Ninja Newsletter

Message

[4]
I’m sorry tohear that, [1-1]. How may I help you then today?
image/svg+xml

[1-1], thanks for contacting me. I’ll review your mail, and get back to you – typically within 24 hrs.

image/svg+xml
Name: [1-1] [1-2]
Email; [2]

Contacted you via the Siphon form at Ninja News.

I don’t want to subscribe to the Ninja Newsletter right now.

Message

[6]

Thanks again for contacting us. Your request was successfully submitted.

Stacks Image 76647

… take a look at our store, you might find exactly what you're looking for:
Templates; Foundation Projects & Freebies.

Feel overwhelmed by the possibilities that Foundation, or BWD stacks offer?
If you're looking for a starting point, or have a pressing deadline …

Stacks Image 76621
Stacks Image 76623
Stacks Image 76625
Stacks Image 76627
Stacks Image 76629
Stacks Image 76633

Pai Time

Contact Information

rjh logo

rjh web design

265 Moo 2
Mae Na Toeng Nai, Pai
Mae Hong Son
Thailand 58130

About Us

We design websites and print-products for small businesses at reasonable prices. We specialise in Responsive Web Design.

Legal

This site uses Cookies to determine the best method of display in combination with your browser.
We do not harvest or sell personal information.
© rjh web design 2010—17

Powered by rjh-design

This website was built with loving care on a Mac using Foundation. For more information, contact me.

Don’t miss a post!

Sign up for our monthly newsletter.

A monthly digest of all the latest updates from our RapidWeaver blog, keeping you up to date with the hottest new stacks and themes.

View previous campaigns.

Subscribe to the Ninja Newsletter

* indicates required