Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Pop-up layer with dark background – how?

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #252492
    UrfinJuice
    Participant

    Hello,

    I would like to have something similar to effect which appears here:
    http://www.investmaniacs.com

    In other words – the layer with content should popup with dark area around it. So, just
    $(#layerid).show(); is not enough. Any ideas on how to implement this feature in a fast way? Is there ready-to-use plugin?

    #252493
    Beverleyh
    Participant

    $(#layerid).show(); is not enough.

    Should be. Fixed-position #layerid to all 4 corners of the viewport and give it a semi-transparent background-color (rgba). Then put your content “popup” in the middle, inside #layerid.

    #252501
    UrfinJuice
    Participant

    Does anyone know a link to jquery/css plugin, which represents ready solution and is 100% mobile-friendly?

    @Beverleyh
    : thanks for the advice!

    #252516
    Beverleyh
    Participant

    You’ve already got the building blocks with $(#layerid).show(); and what I posted previously. A bit of basic styling and… done; positioning the layer base into all 4 corners will automatically be responsive, so all you’d need to do is use fluid values (e.g. %), and maybe the odd media query, to style the inner popup for mobile. I don’t think you need a plugin at all. In fact, it will probably take longer to search for one than roll your own. How about taking a few design ideas from the link you posted (inspect it in dev tools) and replicate the look of that one?

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.