Chrome and Firefox have started showing insecure warnings on sites without SSL Certificates . Without SSL, your website will show insecure to the visitors. Therefore, using an SSL-encrypted connection for safety, accessibility or PCI compliance reasons is necessary. It becomes very important to redirect from HTTP to HTTPS
Back in the old days, it was impossible or really hard to achieve this kind of effect, but thanks to ever-increasing support for CSS3 across browsers, it’s now possible to set up effects like these without any scripting at all. There are sadly still browsers (IE9 and below) that don’t support CSS3, so you’ll either need a fallback for legacy browsers or to treat the effect as a progressive enhancement.