Close

Account

Documentation

Forum

Menu

Parallax background for whole page

  • Post count: 8
    pabloamigo
    June 19, 2014 at 10:30 am #401

    Hi there

    I wondered whether it was possible with a bit of CSS tinkering to have a parallax background that runs through the whole page?

    You can sort of see what I’m trying to do here I think: http://aspect.returnonideas.co.uk/ – but I’d like to be able to still have sections and link to them through the main navigation. Also, I’d like to push the parallax elements to the right and left of the content.

    Many thanks

    Post count: 2485
    Jegbagus
    June 19, 2014 at 12:47 pm #406

    hi pabloamigo, if you mean by clicking menu will go to section, you can do some tricky method by adding ID on element. you can use script editor that available on section builder. i attach how you can do it on script editor.

    for left & right parallax, have you try to use Background Align ? or you can create background with wider than 1200px and put image on side of those 1200px image.

    Thank you 🙂

    Post count: 8
    pabloamigo
    June 19, 2014 at 12:49 pm #408

    Thanks Jegbagus – I’ll give those two things a shot.

    Paul

    Post count: 2485
    Jegbagus
    June 19, 2014 at 1:23 pm #410

    ok pablo, let me know if its work.

    Thank you

    Post count: 8
    pabloamigo
    July 1, 2014 at 1:57 pm #958

    Hi Jegbagus

    You can see what I’ve done with the page here: http://aspect.returnonideas.co.uk/

    Nearly there now.

    Just had a quick query about using the ID element on a p tag – can’t seem to get this to work. I’ve added this: <p id=”services”>Content</p> into the source code, but can’t seem to get it to link from the main nav (Our Services link). What should I be putting in Appearance>Menus>Menu Structure>Our Services (custom link)?

    Also, is there any way I can get the top menu (with logos) to disappear completely when you start to scroll? I just want to leave the main nav.

    Many thanks

    Post count: 8
    pabloamigo
    July 1, 2014 at 2:51 pm #963

    A quick update – I’ve got the internal links working now (if you check the link you’ll see). I wondered whether there was anyway to incorporate a smoother transition/scroll between menu elements? (like you have here:http://jkreativ.jegtheme.com/villa/)

    I presume this is some sort of Jquery?

    Post count: 8
    pabloamigo
    July 2, 2014 at 8:13 am #1007

    Update#2

    Don’t worry about the last point, I’ve sorted now.

    As a final point, I wondered how I could fix the top menu (both parts) to the top of the page? (i.e. so the section with the logo on doesn’t move up as you scroll)

    Post count: 2485
    Jegbagus
    July 2, 2014 at 9:38 am #1011

    hi pablo, you can use bellow code, and put it on jkreativ dashboard > additional css :

    Thank you

    Post count: 8
    pabloamigo
    July 2, 2014 at 12:35 pm #1016

    thanks for that Jegbagus – however, I can’t get it to work.

    I checked in Chrome Inspect Element and as soon as you start to scroll the style changes to (0px, -38px, 0px).

    Any ideas?

    Post count: 2485
    Jegbagus
    July 3, 2014 at 2:55 am #1035

    hi pablo, it seem you already able to fix the problem right?
    Congratulation!

    hopefully your business going well.
    Thank you

You must be logged in to reply to this topic.