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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Jun 2013
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Exclamation Images/background not scaling with browser's zoom

    Hi! I'm not a very skilled html/css coder, but today, I've visited a website with a feature that really impressed me, since I can't realize how it works and I'm really looking forward to learn that "technique".

    It's all about images not getting resized with browser's zoom, but with its size. (Yes, I know... Its something UBER easy for sure, but again, I'm not that skilled)
    I mean, if you set the browser window to "windowed" then you can see the image is going bigger, but if you CTRL + rolling down the mouse scroll wheel you can see the image size isn't being affected... It is an awesome way to display backgrounds IMO, and I really can't realize how this works, can some skilled coder explain me a little better how to achieve that kind of behavior?
    Which div's structure is that site following along with CSS class to get that?

    Explanation summary:
    When zooming a website like http://facebook.com you can see the whole website is getting re-sized, but in this case (http://theuprisingcreative.com/) those images aren't being re-sized with the rest of the website, ex:

    Zoom at 100%:


    Zoom at 33%:


    Thanks in advance

  • #2
    Junsee
    Guest
    in chrome you can right click an internet page and select "Inspect Element"

    this gives you a coding run down of the entire site and how it is working

    in this case they have stretched the html to width 100% and height 100%
    then made a scroll through menu that shuffles through backgrounds

  • #3
    New to the CF scene
    Join Date
    Jun 2013
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Yes, I tried to inspect this with Chrome but I couldn't understand this, because I tried to do it by myself but without success...

    Again, I'm just starting to make my own templates.

  • #4
    Regular Coder
    Join Date
    Aug 2012
    Posts
    145
    Thanks
    0
    Thanked 26 Times in 26 Posts
    Hola,

    Looking at the code, it appears to be using jquery. So i found this site that may help you attain what you're looking for relating to a fixed size background even when zooming in or out.

    Hope this helps:

    http://bavotasan.com/2011/full-sizeb...jquery-plugin/
    1 Corinthians 15:3-4 / Ephesians 2:8-9 - What or Who are you living for? Jesus is returning very soon

  • Users who have thanked Brandnew for this post:

    LordFede (06-13-2013)

  • #5
    New to the CF scene
    Join Date
    Jun 2013
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thank you very much! That's amazing! Helped a lot


  •  

    Posting Permissions

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