Animating secondary elements video tutorial - Page 1


Ambassador
291 posts

Here's a video (part 2) that covers adding animation transitions to secondary elements on a slide.

Hope it helps everyone get up and running!

Jeff

https://www.youtube.com/watch?v=nbW4tVp21gY
http://www.pixelandpoly.com/ (built with Bootstrap Builder)
Video Tutorials - https://goo.gl/KJCsjA
The Universe from A to Z - https://universeatoz.com/ (built with Foundation Framer)


Registered User
45 posts

Hi Jeff,

Thank you so much for taking the time to produce this tutorial, it has made things much clearer to me now (I am one of those people who find visual explanations much easier to follow).

Kindest regards,
David


Ambassador
291 posts

Glad it helped!
http://www.pixelandpoly.com/ (built with Bootstrap Builder)
Video Tutorials - https://goo.gl/KJCsjA
The Universe from A to Z - https://universeatoz.com/ (built with Foundation Framer)


Registered User
43 posts

Hi Jeff,

I can't get suitable help from the CC support staff, and you seem to be well versed with RCS, so may I ask you a question?

I have been using background images with animated text overlays just like your example, and it works fine, except that as I reduce the viewport size, the slide container doesn't shrink in height, so I end up with lots of white space underneath the finished slideshow on smaller devices. I tried changing the max-height at several breakpoints, but the space still grows until the next breakpoint is reached.

It was suggested to use the images as elements rather than backgrounds, but if I do that I can't figure out how to position the text animations on TOP of the images. They want too go above or below. Is that something you could make a video of for us newbies?

If you do that, how will I know it is done?

Thanks for your previous videos - they are a great help in the absence of any real documentation.

Terry.


Senior Advisor
17,656 posts
Online Now

Hi Terry,
Can you share your RCS file so we can see what your doing? It does make it easier to help.;)
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

Here's my S-Drive site with
examples of what can be accomplished in VSD.
http://progrower.coffeecup.com/
Here's my CoffeeCup SCCP Shop with examples of what can be done.
http://progrower.coffeecup.com/shop/
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personnel site used for testing and as an easy way to share photos.(RLM imported to RSD)
http://ericrohloff.com


Ambassador
291 posts

Terry,

Like Eric said, if you could share your RCS file we might be able to help a bit. I can try to work up a video for that but it wouldn't be for a few days most likely. Regarding any new videos that I might do, the easiest way to know about them is to subscribe to my YouTube channel. I think YouTube also has notifications now so you can get notified when there are new videos. But if you didn't want to use that (I don't like that feature) you can just check the channel every so often too. I'd most likely make a thread here if I do any new videos that might be useful to the community as well. :)

https://www.youtube.com/channel/UCQMcF0 … _2WnpZ6EKA


http://www.pixelandpoly.com/ (built with Bootstrap Builder)
Video Tutorials - https://goo.gl/KJCsjA
The Universe from A to Z - https://universeatoz.com/ (built with Foundation Framer)


Registered User
43 posts

I've attached the project file, but it's with the background images. I never saved my experiments with non-background images, because they all failed!

The file will show what I'm trying to achieve but I want to NOT have to deal with the white space under the slider as the viewport reduces in size.

Thanks.
Attachments:


VP of Software Development
49,402 posts

You had no breakpoints set Terry. I started your project over using the Background theme and just applied your background images. Also setup a Heading and Animation.

You still need to do some customizations, but there is no white space any more.
Attachments:
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.


Registered User
43 posts

I know I had no breakpoints Scott - I removed them all. The file you sent back is exactly the one I sent you, which already had those headings and animations.

Adding a breakpoint makes no difference. It still has all the white space underneath. See attachment.

I asked you for help on this before and rather than helping you told me I had to pay for support, which is why I'm posting in the forum. Please look at the attachment and try to understand what I'm asking for.
Attachments:


VP of Software Development
49,402 posts

You NEED breakpoints otherwise it is not going to be responsive. I see no white space here. This is a quick site I made with my modified project. You will see no blank space and it is fully responsive.

http://five.coffeecup.com/index.html

If you are not happy with the effort I took here, hopefully some of the other volunteers will have some spare time to dedicate towards your project.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.