Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New to the CF scene
    Join Date
    Apr 2013
    Location
    San Diego
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Setting up a Smooth Scroll webpage.

    Hey everyone, this is my first post on this forum and I just wanted to first say that I'm pretty new in coding and my knowledge is more on the HTML and CSS side. I'm learning Java and PHP, and anything else that I'm finding as I go along.

    So my plan is to build a portfolio for myself and would like to do it in a single page Smooth Scroll style. I've googled all sorts of things regarding smooth scroll and have come across sites that provide a basic template.

    My question is,
    1. how would I begin the process of just setting up the page?
    2. would all I need to do is just create separate DIV's that would define each section?
    3. How long would the page need to be in order to execute a good scroll?

    Ive seen some sites that use smooth scroll and each section is pretty small where the scroll isnt very long.

    4. How many different Java scripts are there for using smooth scroll?

    Any suggestions or even resources would be awesome. Thanks in advance!

  • #2
    New Coder
    Join Date
    Mar 2012
    Posts
    18
    Thanks
    1
    Thanked 1 Time in 1 Post
    no, this has to do with the browser, not the code

    second, if you want to modify the way the browser works, you need javascript. what you want cannot be done with html or css. thus, post it in the javascript section, or better yet forget about it. no need to have this.

  • #3
    New to the CF scene
    Join Date
    Apr 2013
    Location
    San Diego
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    What do you mean it has to do with the

    Browser? I understand that smooth scroll is a java code. My question was regarding the setup of HTML.

  • #4
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,955
    Thanks
    9
    Thanked 726 Times in 720 Posts
    There's no need to have this, but there's no reason not to if you like the effect.

    There are no rules as such about how you set up your html if you're building your own code, which would be in javascript (not java - that's a different language).

    Have a look http://css-tricks.com/snippets/jquery/smooth-scrolling/ for a plain javascript example, or here for a jQuery plugin if you prefer.
    Use the W3C HTML Validator and CSS Validator to check your code and Firebug to see what css is applied to an element
    Read Steve Krug's book Don't Make Me Think - essential reading on web usability
    I don't recommend much, but I do recommend Clook for UK web hosting

  • #5
    New to the CF scene
    Join Date
    Apr 2013
    Location
    San Diego
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts
    [QUOTE=SB65;1328919]There's no need to have this, but there's no reason not to if you like the effect.


    I'm trying build a decent portfolio, and seen a lot of sites online that use smooth scroll and thought it was a cool effect.

    In your opinion, what would you suggest doing that looks a bit more professional? Again I'm still learning and want to make sure that I have a strong website when people see it.

    I'm just curious, I'm one of those "gotta do it right" type of person

    I'll check out that book, and I do use those plugins you suggested, they really do help.

  • #6
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,955
    Thanks
    9
    Thanked 726 Times in 720 Posts
    Cella, I was really saying that in response to webaddict's comment 'no need t have this'. There's no reason not to use it if you like it.

    Bear in mind that the scroll won't work if the user has js disabled, so make sure whatever you use still allows the user to navigate your portfolio in this situation.
    Use the W3C HTML Validator and CSS Validator to check your code and Firebug to see what css is applied to an element
    Read Steve Krug's book Don't Make Me Think - essential reading on web usability
    I don't recommend much, but I do recommend Clook for UK web hosting

  • Users who have thanked SB65 for this post:

    Cella (04-18-2013)

  • #7
    New to the CF scene
    Join Date
    Apr 2013
    Location
    San Diego
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts
    That makes sense. I've still gotta lot of learning to do, so this info is definitely helpful. Thanks for the input!


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •