How to Recreate ET’s Layout Pack Previews with Fan Out Hover Effects in Divi - Best Webhosting

ULTRAFAST, CHEAP, SCALABLE AND RELIABLE! WE STRONGLY RECOMMEND ACCU WEB HOSTING COMPANY

Watch Wordpress Elegant Themes Video: How to Recreate ET’s Layout Pack Previews with Fan Out Hover Effects in Divi.
One of the cool features of the new website design of elegantthemes.com is the premade layout pack previews on the Divi product page. What makes this design unique is how each layout pack is featured with three separate images that fan-out on hover.

Today, we’re going to show you how to recreate the design of our layout pack previews with that same impressive fan-out hover effect in Divi. Because the design is a bit more advanced, we will be using some custom CSS in combination with Divi’s built-in design options. But don’t worry, it won’t take long to build and the result is definitely worth it.

Read more: https://www.elegantthemes.com/blog/divi-resources/how-to-recreate-ets-layout-pack-previews-with-fan-out-hover-effects-in-divi

Published: Friday, August 30, 2019 12:11 PM
Category: Wordpress Elegant Themes

95 Views

Related Videos

Popular
How to Add Book Previews to Divi’s Author Layout Pack

by Best Webhosting Added 6 years ago 102 Views / 0 Likes

Every week, we provide you with a new and free Divi layout pack which you can use for your next project. Along with every layout pack, we also share a use case that’ll help you take your website to the next level. This week, as part of our ongoing Divi design initiative, we’re going to show you how to add book previews to your website using Divi's Author Layout Pack and the free 3D Flipbook plugin. Adding previews to your website helps visitors in the
Popular
How to Add Resume Downloads & Typing Effects to Divi’s Copywriter Layout Pack

by Best Webhosting Added 6 years ago 109 Views / 0 Likes

Helping you get a website up and running without a lot of effort is the main goal of our Layout Pack Use Cases initiative. And this time, we’re helping you set up a copywriter website with the free Copywriter Layout Pack for Divi. Although this layout pack already has most of the elements your copywriter website needs, in this use case tutorial, we’re going to help you take it a step further by showing you how to add resume downloads and typing effect
Popular
How to Design a Recent Posts by Category Layout with Cool Hover Effects in Divi

by Best Webhosting Added 6 years ago 107 Views / 0 Likes

Multistreaming with https://restream.io/ For this tutorial, we are going to show you how to display recent posts by category. Using only the Divi Builder (and a few blog modules), we are going to create a section that displays the latest posts from four different categories. This recent posts by category section will include unique category tags, animations, and hover effects – all without a plugin. Check it out! You can read the post for this use cas
How to Recreate The Color Filters, Effects & Blend Mode Examples with Divi (Part 2)

by Best Webhosting Added 6 years ago 96 Views / 0 Likes

Welcome to the last part of this 2-part series on how to recreate our color filters, effects, and blend mode examples with Divi. You can check out our filter demo page for a look at these examples to get an idea of what we will be creating together. In the last tutorial, I recreated sections #1, #2 and #3 of the filters demo page. I highlighted how to use Luminosity, Multiply, and Overlay blend modes combined with a number of filter and effects to cre
Popular
How to Recreate The Color Filters, Effects & Blend Mode Examples with Divi (Part 1)

by Best Webhosting Added 6 years ago 111 Views / 0 Likes

Welcome to our 2-part series on how to recreate our color filters, effects, and blend mode examples with Divi. You can check out our filter demo page for a look at these examples to get an idea of what we will be creating together. With the recent release of Divi’s new Filters, Effects, and Blend Modes, you have a complete arsenal of design tools within the Visual builder. Now you don’t have to go to Photoshop everytime you want to make these kind of
Popular
Divi Responsive Settings, Divi Layout Pack, Divi Global Items & 7 More Awesome Divi Features

by Best Webhosting Added 6 years ago 177 Views / 0 Likes

Grab Your Free 17-Point WordPress Pre-Launch PDF Checklist: http://vid.io/xqRL Divi Responsive Settings, Divi Layout Pack, Divi Global Items & 7 More Awesome Divi Features https://youtu.be/5vssWZeSI6g Divi responsive settings, Divi layout pack and Divi global items are just 3 of the many great Divi features I'm going to demo for you in this tutorial. The Divi theme is my go-to theme at the moment because of its' capabilities. There are other great the
Get a FREE Header and Footer Layout for Divi’s Acupuncture Layout Pack

by Best Webhosting Added 4 years ago 66 Views / 0 Likes

Hey Divi Nation! Thanks for joining us for the next installment of our weekly Divi Design Initiative where each week, we give away brand new freebies. Recently, we shared a brand new Acupuncture Layout Pack. To help you get your website up and running as soon as possible, we’re sharing a global header & footer template that matches this layout pack perfectly as well! Hope you enjoy it. Read more: https://www.elegantthemes.com/blog/divi-resources/get-a
Popular
Free Divi Layouts - How to Install Layout Pack Tutorial for Divi 3.1 By Elegant Themes [2019]

by Best Webhosting Added 6 years ago 153 Views / 0 Likes

Get access to the best free Divi layouts for use with the Divi WordPress theme by Elegant Themes. Follow along here: https://ohklyn.com/free-divi-layouts/ Divi discount: https://ohklyn.com/go/divi-discount Hosting discount: https://ohklyn.com/go/bluehost-discount The Divi layout packs include a freelancer layout pack, SaaS or businesses layout pack, restaurant layout pack, and an online store or marketplace layout pack, just to name a few. With the re
Popular
Exclusive Divi Cyber Monday Gift #6: An Impressive Footer Layout Pack for the Divi Theme Builder

by Best Webhosting Added 6 years ago 132 Views / 0 Likes

Want this free gift? Shop our Cyber Monday Deal here: https://www.elegantthemes.com/cybermonday Everyone who purchases a new Elegant Themes Membership or who upgrades their existing Membership will gain access to this free gift in the members area of their new account. Current Lifetime Members can access it right now! Simply go to the new Cyber Monday Perks page in your members area: https://www.elegantthemes.com/members-area/perks/ Like us on Faceboo
Popular
How to Add Advanced Hover Effects to Divi’s Blurb Module Using Hover css

by Best Webhosting Added 6 years ago 116 Views / 0 Likes

In today’s Divi tutorial, we’ll show you how to add some advanced hover effects to Divi’s Blurb Modules using Hover.css. Of course, out of the box, Divi has all you need to create stunning blurbs for any kind of page you could think of. But in our community we know there are a lot of designers always looking to push Divi to (and sometimes beyond) its limits in order to make a client site just that much different from the competition. So this tutorial
Popular
Free Divi FAQ Layout Pack

by Best Webhosting Added 6 years ago 139 Views / 0 Likes

In this video we show you how to install and use the free Divi FAQ Page Layout Pack. You can find this download for free in our Divi 100 Marathon series on the Elegant Themes blog, counting down to Divi 3.0 Get the layout pack: http://www.elegantthemes.com/blog/divi-resources/free-divi-faq-layout-pack
Popular
Get a FREE Bar Layout Pack for Divi

by Best Webhosting Added 6 years ago 140 Views / 0 Likes

Hey Divi Nation! Thanks for joining us for the next installment of our weekly Divi Design Initiative; where each week, we give away a brand new, free Divi Layout Pack from our design team to you. For this week, our design team has created a refined Bar Layout Pack. This layout pack is complete with all the necessities for marketing a bar online. The design is sleek and includes beautiful framing elements to make the custom photos stand out. The pack c