The automatic scaling @vermau works quite well and reduces your workload load when creating a fully functional and responsive website.
For me I custom layout the 960 and use it to auto scale the 1200 & 768 devices.
I then custom layout the 320
Hi @vermau.
To adjust the animation you have to click on the circle with three dots on the right.
This opens a panel from which you can make the adjustments you need for your animation.
Here you have more documentation about it.
https://sparkleapp.com/docs/animation.html
Good luck
Thank you @Saeta, I will try that. Also can you help me understand how to make a full screen hero banner or full screen image slider in Sparkle. I canât find a way to make the hero banner full screen
Thanks,
Ujjwal
@vermau, when it comes to full-screen width Iâm assuming you mean full browser width then it is quite simple when it comes to imagesâŚ
Select the Image or Image Gallery and go across to the right and under the Arrange tabâŚ
I imagine you want to replicate the same effect you have on your website.
If so, it seems to me that this zoom effect cannot be done in Sparkle.
But letâs go by parts. A long explanation is coming 
A preliminary clarification. I work with the program translated into Spanish, so it is likely that the names of the buttons that I am going to indicate are not exactly the same in English. Even so, I hope it will help you.
Image Hero: You have to use a box to be able to do it, or convert an image into a box (right mouse button).
Once in the work area, select the box and go to the inspector (tools on the right) and in the Style tab you have the first drop-down button with the Content you can insert in that box. Select image and search for it on your computer.
You can also drag the image directly into the workspace, right-click on it and select âconvert to boxâ. Itâs faster.
You will see in the right inspector the thumbnail of the image and underneath some options. Check the Stretch box and the Fill button.
Then, in the Arrange tab of the inspector, check the âFull Page Widthâ checkbox.
Now you should have the image occupying the whole screen in a horizontal band.
The last step is simply to drag the center handle of the image down to the height you want it to be, but you can also do this by entering the height in px you need in the Position and Size tab of the Arrange tab.
Animation. Sparkle is quite limited when it comes to animation, although it has some nice options.
What you would need to replicate the effect of your web, is a point animation control to zoom out, but Sparkle does not offer control over scrolling. The only possible control is over timings and repetitions, the rest is automated in a fairly basic way.
However, for scroll animations, there are more adjustment options, although it must be taken into account that it is intended for the creation of fixed webs. This means that some animations will be affected if the browser window is resized.
A plausible solution is to use a video with this effect. Being so few seconds, it can compensate for that lack, without too much bit overhead. Sparkle allows you to set a video to full width, with practically the same steps as with images but, in this case, you donât have to convert it to a box since the video treats it as if it were a box.
I hope I have been helpful. 
Thank you @Saeta for such a detailed and step by step explanationâŚ
From all this I can understand that Sparkle is good for small one page websites. For some serious website development one might have to look for other bigger alternatives like Blocs and Rapidweaver. My both sites for both businesses (https://punjabinukkad.co â being developed in Blocs) and (https://kvngroup.au â being developed in Rapidweaver) have quite a couple of features that donât look possible in SparkleâŚ
I would like to thank you once again for all your help !!
Thanks,
Ujjwal
Hello Primo,
I read one of your other posts about full height banner image, implemented it as explained by you but it did not work for me. I also tried to give an overlay effect to the whole banner image by using another box element, the overlay box only displays at the bottom half of the page. It does not cover the full height of the page. My CSS code in the embed element is as follows:
<style>
#hero_banner_box,
#hero_overlay_box {
height: 100vh;
}
</style>
I have attached a screenshot of the banner image. It has white area at the top and bottom I canât understand why. The image is quite big in size to cover the whole screen, but I think like Duncan said that the aspect ratio changes as the browser height is changed, it maintains the width, but does not maintain the height.
I wish this could be implemented as an inbuilt feature within Sparkle.
Thanks,
Ujjwal
Hey! Okay, i see
Using images its easier. You can use the popup approach instead of all the code from my other post (was one year ago)!
You will create a Popup and config it as âFixed in Windowâ, âUse canvas position and widthâ and âadjust to browser heightâ. Also remember to set it to âfull page widthâ and to untick the âAlways on Topâ option.
Next youâll want to set it to open automatically and the delay time to 0s, and after that, youâll move it below everything else in the Layers panel. Now you just have to adjust, but the image will cover the entire browser height.
Itâll be like 2 years since iâve wanted a way to make full height images available in Sparkle, but iâve been using the code method and this popup method for the most part. Not ideal, but it works the same (and the popup method is better than the code option since you donât destroy the layout coordination and structure)
See if it helps you!
1 Like
While I respect your opinion, I think itâs ungenerous to say âsmall one page websitesâ. Maybe you have not seen some recent Sparkle websites, and many more with hundreds or thousands of pages:
https://www.socialgreenhub.org
Your argument anchors around a single feature that isnât built-in in Sparkle, but is in other website builders. Sparkle isnât about coding, and if that single feature is your filter, I think itâs just a myopic point of view.
Wow @vermau , Iâm sorry I gave that impression of Sparkle. 
Sparkle is a great tool for making websites as large (many pages) and as professional as you want them to be. Look at these two examples:
The thing is, as with other tools (like Bloks) it doesnât always have what one would like, although support and improvements are ongoing.
Look at this example:
Of course, everyone is free to set the limit on the features that are essential for the choice of your tool.
From my point of view, based on my personal experience with Bloks, WorkPress and Sparkle, I think the latter is the most versatile, secure and flexible of all. Although it also, for me, has a steeper learning curve, not because of the difficulty of the tool, but because of the change in concept and thinking it requires.
I would give Sparkle a try. And I donât take any commission, I just think it is a very good tool to create professional, attractive and secure websites.
Thank you @primo for all your help until now. I will continue to convert and build my food website in Sparkle and see to what extent I can build my siteâŚ
Thanks,
Ujjwal
Wow @Saeta the site is indeed amazing and I am thrilled to see what can be done in Sparkle. I will try to convert and build my food website in Sparkle and see to what extent I can build my siteâŚ
Could you please help me out with what element did you use to create this divider on the website⌠Pic attached below
Thanks,
Ujjwal
That is a box with content set to âGradientâ and with Rounding set to⌠25px maybe?
1 Like
Hello Duncan,
Thank you for the reply. I am still exploring Sparkle. I bought Sparkle two years ago and then shifted to Rapidweaver after giving a fair bit of try from my side. I was able to build my website in Rapidweaver the way I wanted to. But recently I upgraded my Pro lic with developer tools to 4.x as I thought to give another try to the tool.
I must say that I never thought that sites like these are possible to make in Sparkle. Consider this my ignorance of the tool or a too early notion that I created about the software in my mind. I understand that it takes a lot to write a software (as I myself have been a software developer in the past).
I understand that Sparkle is your baby and I didnât mean to hurt you at all. My apologies if it sounded like that.
I am going to continue to build my website in Sparkle especially after having a look at all the websites that you have listed. I see a lot of potential in the app now. Itâs just that I am not able to find much tutorials or videos on google about the latest version of the app with the advance features except for the documentation and this forum. Sometimes you know that one desires to have a quick tutorial or watch a quick video on Internet instead of leaving a query in the forum as it takes some time for the community to respond.
I am sincerely thankful to all the senior community members and appreciate their effort who have been helping me out with my queries in detail about various things in Sparkle. I will continue to seek help and support from the community in the future as well. I hope some day I am also able to help someone with their query and contribute to the community.
Thanks,
Ujjwal
1 Like
Hi @vermau I have not been the designer of these sites, I have simply shared two of the latest professional works made entirely with Sparkle that have been presented in this forum. Here you have the links to their threads in case you want to ask their authors.
Anyway, I think @primo has answered your question correctly. 
You have to keep in mind that almost all Sparkle components are designed to offer the maximum possible flexibility. So, to work with this tool, you have to change the mental chip of the prefabricated to start making by yourself the solutions for your project.
Good luck with the reworking of your website. 
While Sparkle is my baby, I have a tough skin and you can write anything 
But I think a mischaracterization of what Sparkle can do, thrown in casually as fact, is unfairly damaging.
Trust me Duncan, I am loving to work in Sparkle now. I am halfway through my food business website already. Though some challenges are there, but I am sure I will get help from the community to resolve those issues.
Please check my website I am developing in Sparkle ( https://punjabinukkad.au/test ). Your valuable feedback is welcome !!
I can only imagine that ver 5.0 will be power packed with new features. Few things that are in my wish list are:
-
The ability to create components that can be reused within the same project or other projects and the freedom to make cosmetic changes to each instance of the component as desired.
-
Layout Block dividers with the ability to provide an angle to the dividers
-
Few more options for animations on elements like Zoom out effect (going from 150% to 100%) with the ability to hide the overflow of the image
-
Addition of few more filters like Backdrop filter on an element to create a subtle blur effect on the object behind the element
-
Ability to create global swatches and pallets for the app as a whole and for the current project
Maybe I am just overthinking. I know you donât disclose the upcoming features in the new version, but this is just my wishlist.
Thanks,
Ujjwal
1 Like
This is already possible, background filters are a feature of boxes:
See for example the header of sparkleapp.com
If by global you mean that can be used across projects, thatâs not currently implemented. If you mean within a single project, thatâs always been the case, since version 1.0 actually. All colors are synchronized across elements that use the same color well.
nothing to do with site building, but canât help wondering: do you really mean ârelinquishâ your taste buds??? hope not, for your customers . . .