Jump to content

Search the Community

Showing results for tags 'parallax'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • The Web Designer Forum Community
    • Web Designer Forum News
    • Web Designer Forum Introductions
    • General Chat
    • Design Competitions
  • Web Design Resource
    • Website Design and Layout
    • Website Reviews and Feedback
    • Other Resources
    • Graphic Design Forum
  • Web Development
    • Frontend
    • Server Side
    • Content Management Systems (CMS)
  • SEO, Website Marketing and Business
    • Social Media
    • Freelancing, Business and Legal Discussion
    • SEO (Search Engine Optimisation) & Search Engines
    • Website Management
  • Software & Hardware
    • Web Browsers
    • Web Design Scripts & Software
    • Web Development Scripts & Software
    • Hardware
  • The Marketplace

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start




Website URL




Found 14 results

  1. Hello, hi Guys. I just want to know which must have js libraries do i need to get for a modern website. I thought about a parallax lib to make my site more lively, but i couldnt find a good one. So..., just link your choices for a modern js libs down below 👍😉
  2. Matthew Claffey

    Parallax with a picture element?

    Hello, Is there anything out there that has a background attachment effect with a picture element? Due to the client requirements they want a background attachment effect but the website is being built as a cms system so we are using picture elements to improve the performance for mobile and tablet users. Has anyone come across this issue? If so what was your solution? Edit: Background attachment:fixed effect.
  3. gangurus

    simplest horizontal parallax

    Hi. I use malihu script to scroll page horizontal. It works very good for my purpose. Then, i want to use some parallax, on background or full scale div to moving along my content. I tried to use Scrolling Parallax Plugin for jQuery, but it simplt dont work for me. How i can do smt like that in simplest way possible (only one image background - full page have 600%, and img for parallax 300%)
  4. Connovar

    Parallax Help!

    Hi I am trying to leanr to do parallax scrolling, i did this tutorial that worked for vertical parallax - <!doctype html> <html> <head> <meta charset="utf-8"> <style type="text/css"> body { margin:0px; background:url("BlueOrca/Images/background.jpg") fixed; } #content_layer { position: absolute; } #prlx_lyr_1 { position: fixed; background: url("BlueOrca/Images/logo2.png") no-repeat 0px 200px; width: 100%; height: 800px; } </style> <script> function parallax(){ var prlx_lyr_1 = document.getElementById('prlx_lyr_1'); prlx_lyr_1.style.top = -(window.pageYOffset / 4)+'px'; } window.addEventListener("scroll", parallax, false); </script> <title>Untitled Document</title> </head> <body> <div id="prlx_lyr_1"></div> <div id="content_layer"><script> for(var i=1; i < 50; i++){ document.write('<h1>This is dummy line '+i+'</h1>'); } </script></div> </body> </html> But i am wanting to do horizontal parallax, i thought if i change the pageYOffset to pageXOffset, thats all that would be needed but apparently not, I dont know javascript very well but i thought thats all that was needed, can someone help? Thanks
  5. predatorx

    Parallax Scroling

    Hello all. Can anyone point me in the right direction with a tutorial on how to create the effect seen here. I've tried a few tutorials, but none have the parallax effect like this one. Any help would be grateful. Thanks
  6. check out my new work with parallax .. still under development, but just created it structure.. http://webiworld.com/magic/ Reviews please
  7. Hi! I've made a website and tested it on all browsers and just in Chrome the parallax effect doesn't work. When I click on the nav button, nothing happens. I don't know why? Please help me!
  8. OK, so my problem is that I have a parallax website for a client and they would like a product description to fade-in when they scroll-down the parallax site. The problem I think I have is because the site is effectively one long page, the scripting is getting confused and fading the div in from "opacity:0" when the page is loaded. I have put a long fade-in on the div to understand what is happening and I have also made a rubbish box without proper formatting to test it. I have uploaded a temporary copy of the site (i'm working offline) to show what is happening. http://ethicalincubator.com/parallax/parallax30.07/index_kmd.php#!images Thank you for your help everyone!!! :-) CSS --------------------------------------------- /* Hide any element */ .hideme { Opacity:0; } HTML ---------------------------------------------- <div class="hideme fadein-on-view" style="opacity:0;width:200px;height:80px;background-color:white;">Fade In</div> SCRIPT --------------------------------------------- <script> // Scroller script for Fade-In when "div" is on screen $(document).ready(function() { /* Every time the window is scrolled ... */ $(window).scroll( function(){ /* Check the location of each desired element */ $('.fadein-on-view').each( function(i){ var bottom_of_object = $(this).position().top + $(this).outerHeight(); var bottom_of_window = $(window).scrollTop() + $(window).height(); /* If the object is completely visible in the window, fade it it */ if( bottom_of_window > bottom_of_object ){ $(this).animate({'opacity':'1'},5000); } }); }); }) </script>
  9. Have you ever made a parallax website for mobile? I'm struggling with that for weeks. I can't find nothing that explains how to make a parallax website responsive. Do you have any tip? I appreciate any answer!
  10. probablybest

    Lower the position of a parallax element

    'm building a website for my friends wedding (http://mhutchinson.me.uk/tom/) and I'm using parallax to make the white 'save the date' text disappear under the cream section with the details in it. I have the basic functionality working but I cannot get 'save the date' image to sit lower down. It always butts up against the top or if I move it down it doesn't work properly. Does anyone have any idea of how to position it? Here is the jQuery I'm using: $(document).ready(function(){ //.parallax(xPosition, speedFactor, outerHeight) options: //xPosition - Horizontal position of the element //inertia - speed to move relative to vertical scroll. Example: 0.1 is one tenth the speed of scrolling, 2 is twice the speed of scrolling //outerHeight (true/false) - Whether or not jQuery should use it's outerHeight option to determine when a section is in the viewport $('#intro').parallax("50%", 0.4); $('#logo').parallax("50%", 0.1); $('#infoWrapper').parallax("50%", 0.1); })
  11. Hello! I went through many tutorials and exemples about parallax effect but I didn't find anything that is easy to understand. So, if you have some tip or links to follow, please tell me. Any suggestion is welcomed! Thank you very much!
  12. I have a parallax scrolling single-page site that I am working on, and for some reason, when you scroll down to the section called "services" or below (3rd and 4th sections), the page has a constant flash effect occurring. The contact section has even more pronounced "flashing". I have no idea what is causing the flashing effect, nor any idea what to modify to get the site to stop flashing. The site is under development and is now on a dev server http://clients.ergonomiq.net/polarisrm/ By clicking on "SERVICES" in the navbar, the page scrolls down to the specific section and then the flashing begins. It is a simple HTML file with jQuery and a few jQuery plugins. I would copy code here, but I don't even know what to copy and I don't want to bore everyone with the entire code. If someone can point me in the right direction as to what I should copy here, I'll add it. Otherwise, if someone has any idea what the problem is and how I can solve it, I'd really appreciate it. FYI, using Firebug in Firefox and Web Inspector in Chrome and Safari, I was unable to find the problem. There are no errors or conflicts that I can find. The CSS is pre-processed using LESS and compiles without errors. The CSS is not minified and has debugging comments if that helps. The plugins being used are: contact-form.js jquery.flexslider.js jquery.inview.js jquery.prettyPhoto.js jquery.sticky.js nbw-parallax.js smooth-scroll.js Also using 3 web fonts (extensions not included in the list for simplicity of reading): BEBAS fontawesome League_Gothic I uploaded a short screencast showing what I mean. https://vimeo.com/53724547 If you pause the video and advance frame by frame, you will notice that (around the 5s mark) there is a flash and it seems that the contents of the viewport gets momentarily hidden revealing the logo and company name from the very top of the page on a white background (but since the text is white, you can't read the text).
  13. Can anyone recommend a theme which uses a parallax effect. I've had a quick look at a few - Parallaxr and Slide One, I know will not do for my client, Parallax might. I would be interested to hear feedback from anyone who has used a theme with the parallax effect - specifically how easy was it to use, how customisable, how easy for the site owner to update, is it good on seo? You know the usual - client wants everything. Thanks
  14. Hi there, I'm a fairly junior developer and I've just started to play around with some parallax effects with jQuery. I'd love some feedback on the 404 page I've just created; my concern at the moment is for load time, andy suggestions on speeding it up? Design improvements? Thanks! http://404.poneill.co.uk