Forums

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

Home Forums Other Parallax Scrolling!

  • This topic is empty.
Viewing 15 posts - 1 through 15 (of 20 total)
  • Author
    Posts
  • #34048
    mcguiver178
    Member

    I took a look at this post that talks about parallax scrolling and well, i found it sooo amazing, that I’m actually redesigning my webpage to work like this! altho I’m having some troubles with the positioning of the images and everything, so anyone that has mastered this…. I would love to hear from you!

    I took http://www.marklawrencedesign.com/ as an example

    Amazing isn’t it?..

    #85654
    Ampitere
    Participant

    Seriously took it about a minute to load. It looks great though, I’d suggest looking into jQuery Easing (http://gsgd.co.uk/sandbox/jquery/easing/) to allow for a bit smoother scrolling and such.

    Possibly Drag Dealer (http://ovidiu.ch/dragdealer-js) as well to make the page grab-able and more interactive (having to use the middle mount/scrollbar is always a pain and takes away from the glory that is parallax).

    In a nutshell.. make it load quicker, implement easing to make it less sketchy when scrolling, and make it more interactive by being drag-able and such.

    EDIT: Boy I feel silly, I thought that site was yours! Let me help you out a bit with parallax.

    While I know very little about it, I know of the components you need to run it. I haven’t got the chance to but it really just takes some time and effort to master, and I don’t really think you can only know a little and get away with it considering the fact that it requires a lot of different components while maintaining things like quality, speed, and efficiency.

    The problem with most parallax websites, like Mark’s website, is that they take FOREVER to load. That and they are completely ridiculous when scrolling which makes it look terrible. The two applications I mentioned previously when I thought the site was yours are great for implementing parallax.

    Here is a very simple parallax effect tutorial that you can build off of and learn from: http://tympanus.net/codrops/2011/01/03/parallax-slider/

    I highly suggest getting together with others who have done or are wanting to do this as it will require a lot of time and if you have multiple heads working at the same time you may catch a quick fix or key aspect that someone else didn’t.

    Needless to say, I have the feeling that parallax will just keep growing in popularity and will eventually produce more and more tutorials for those of us who are still behind.

    I wish you the best of luck in your endeavors!

    #85658
    Ampitere
    Participant

    Here is also a website that uses a side-scrolling parallax with drag dealer and jQuery easing implemented:

    http://yessbmx.com

    It is by far the best parallax website I have seen, and I wouldn’t doubt it that it’d be easy to swap the side-scrolling to vertical-scrolling.

    #85702
    mcguiver178
    Member

    I got the hang of parallax scrolling with this plugin:

    http://jonraasch.com/blog/scrolling-parallax-jquery-plugin Altho I havent been able to do the horizontal movement with the vertical scrolling! am still learning, btu I already got the hang of it, it is amazing on how you can make sites look alive with this.

    The trick I used to make the parallax scrolling look better is use lighter images such as gifs and jpgs instead of pngs. the site is still under development but I’ll toss a link once its done to get some comments hehe. am still reading, and pulling tricks out with this parallax.

    I found some other “parallax” scrolling other developers have done in a custom way.

    and thank you @Ampitere I will be cheking out that jquery easing, if you’re interested we can sit and brainstorm this out lol, I got plenty of time to experiment :).

    #85913
    Ampitere
    Participant

    Unfortunately the only time I have open is time developing a contemporary business website for a small business near where I live, but I’d definitely be willing to throw out some ideas if you want feedback.

    #86122
    mcguiver178
    Member

    I’ll upload the project to my personal site and throw you a link so we can discuss with easier time, you’ll see the link here! thanks again :)

    #103534

    have a look at this site http://www.linesandgraphs.com

    #103536
    pkinchla
    Participant
    #118384
    easyselva
    Member

    check out this one

    http://s3learn.com/selva/

    #123060

    OK First post ever! Great site by the way! My favourite scroll is definatelly [this one](http://graphicnovel-hybrid4.peugeot.com/start.html “”)

    But basically my question is these guide seem good but I only have a bit of experience editing wordpress sites. I’m find it really hard to code from scratch.

    Where is a good place to start here? Should I get a HTML5 parallax scroll template and customise it and learn as I go or will that limit me…

    #125041

    Hi all,

    I see that a lot of people are being referred to my site via this post, so that must mean a lot of people are very interested in parallax scrolling as a web design effect!

    I would like to see if you all would like me to write a tutorial on how I created my Awwward winning site over at http://www.marklawrencedesign.com.

    Please contact me via my site if so and ill work on it.

    Thanks,
    Mark

    #130268
    aryanvijay
    Participant

    Hi Mark_Lawrence_Design,

    I visited your new and old parallax site, via a link on this forum. I would like to congratulate you for your website design.

    Will also love to get a tutorial from you, on how you made this parallax site.

    Thanks, Aryan
    [email protected]

    #130272
    JohnMotylJr
    Participant

    @Mark_Lawrence_Design,

    Nice but your ‘Awwward winning site’ takes 12 years to load?

    #130514
    tjapi10
    Member

    @Mark_Lawrence_Design

    I would also like to get tutorial for your site :)

    send me to: [email protected]

    #132767
    maeso
    Member

    please send me the tutorial too! Great job!

    [email protected]

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