Split home page for 2 website - slide effect

Options
Agnes
Agnes Member Posts: 1
edited April 4 in Ask a Question

Trying to recreate the front page effect for 2 locations. Will like to find an option for the sliding effect of the split screen. please advice if there is a way …. :D

https://www.girlandthegoat.com/

home page split screen.jpg

https://www.girlandthegoat.com/

Answers

  • rivallinnea
    rivallinnea Member Posts: 3
    Options

    There's no way to do this natively in Duda. The closest you can get is by creating a full bleed row with two columns, adding a gallery widget to each column, and adding a zoom hoverstate to those images. If you want to push a little further and get development help on this, our team has found this development team to be incredibly resourceful and helpful: https://www.builtbybonfire.com/

  • visioncraft
    visioncraft Member Posts: 151 Learner
    edited October 2023
    Options

    Hey, @Agnes, welcome to the Community! 👋

    As @rivallinnea pointed out, the kind of interactive animation you want would require some custom coding — there is no native widget in Duda that does this "out of the box". Fortunately, this kind of hover animation is actually relatively straight-forward to code, and you could do it all using just CSS (i.e., manipulating the width of flex children during hover). Unfortunately, we can't (yet) edit the HTML/CSS of flex sections, columns and widgets in Duda directly — although there is a feature request for it in the Duda Ideas Board.

    But that doesn't mean you can't do what you want in Duda. Depending on your plan you will have a few options available to you:

    1. Enter Developer Mode and edit the HTML/CSS of your website directly. This is a suitable solution if you are an experienced HTML/CSS coder, and only need to use this solution once in your website.
    2. Use an HTML Widget to hand-code the section. This is a suitable solution if you know a little HTML/CSS, and only need to use this solution a couple of times in your website.
    3. Make a Custom Widget. This is a better, more flexible solution — specially if you think you're likely to want to reuse the same kind of section on other projects.

    If you are not a programmer, or don't feel sufficiently confident in your HTML/CSS coding skills, then you can always hire someone to help you out, as @rivallinnea suggested. One of the great things about Duda is that there is a huge community of Experts available to lend you a hand.

    Hope this helps!

Categories