parallax

Parallax background tiled imperfectly

由 梦想的初衷 提交于 2019-12-12 02:47:38
问题 I have some problems with my parallax background images. I embedded a GIF below that shows the problems: (1) there's a black flickering line at the edge of the texture and (2) the movement is not smooth (and this isn't due to the GIF's small frame rate). I also added the short code for my ScrollableImage class, which is at the heart of how I implemented parallax. I suspected the problem might be due to the modulo operation inside the setScrollOffset method, but that wasn't it and now I'm out

Scrolling height bug using skrollr.js on safari ios7

由 允我心安 提交于 2019-12-12 01:13:03
问题 I've been racking my brain trying to understand what I'm doing wrong. I'm using prinzhorn's skrollr.js for scrolling animation effects on my portfolio redesign and it works great on desktop and even chrome for ios7. But...when loading in safari ios7 it scrolls only so far (to the brand logos section) then stops before reaching the end of the page. Only when I change the orientation to landscape, then back to portrait does it correct itself. I've also noticed some strange inconsistencies when

Why does not (Pure CSS) Parallax Scrolling work properly in Chrome? (Slide #2 background bugs)

由 泄露秘密 提交于 2019-12-12 00:17:37
问题 It works perfectly great on IExplorer, FF, Opera, Safari, and even HTML Validator gives no errors or warnings whatsoever.. I'm totally helpless now :( Site in question: http://www.ubiikki.net As you can see, on second slide the background bugs and spreads to slide 3, not showing the proper background of that slide, like on all other browsers. -- Code I have used (slide 2=slide1 in this code because actual slide1 is just slide): HTML: <div id="slide1" class="slide"> <div class="title"> <h1

Android Parallax - offsetPixel

由 爷，独闯天下 提交于 2019-12-11 23:27:50
问题 I am trying to design a complicated parallaxing animation that resides inside a ViewPager. The animation uses onPageScrolled function's offsetPixel to calculate the position of the images. However this approach is causing a lot of problems due to the offsetPixel if scrolled fast can skip (ex: 1 to 123 to 250 to 251) and when slow it's too sensitive so the animation seems jittery. Is there a better way to calculate the position of the screen besides offsetPixels. If so, can anyone please help

Pure CSS Parallax + Navigation Reveal on Scroll

由 瘦欲@ 提交于 2019-12-11 22:26:41
问题 So I've run into a problem involving pure CSS parallax in combination with a fixed navbar that changes size when the page begins to scroll or returns to the top. Each of the two parts work independently but when I combine them the parallax effect still works while the navbar does not change from it's initial state. Here is the code for the parallax: main { perspective: 1px; transform-style: preserve-3d; height: 100vh; overflow-x: hidden; overflow-y: scroll; } header { display: flex; flex: 1 0

Strange !doctype bug with parallax plugin 'skrollr'

由 时光毁灭记忆、已成空白 提交于 2019-12-11 19:26:22
问题 Ok, so this has been causing me much pain and grief over the past two days and I finally narrowed the problem down but am in no way close to solving it. I am building a parallax website using the Skrollr plugin. The plugin will cease to function in my document as soon as there is a <!doctype html> present. I have created a new simple example and it's still producing the same bug. The strange thing is that on their own website they are declaring the same <!doctype html> as I am but it works

Jerky Parallax in IE7-8

由 六眼飞鱼酱① 提交于 2019-12-11 18:26:02
问题 I've introduced a basic parallax effect into a site that I'm developing. It runs smoothly in Chrome, Firefox and IE9; but it's really jerky in IE7 and IE8. I've looked at far more complicated sites and I don't see anything like the 'jerkiness' that I'm getting. I'm only using two images with a scanline texture over the top. Any ideas what might be causing this? #intro { background: url(../img/graphics/top-bg.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background

Parallax background image that fills container

由 送分小仙女□ 提交于 2019-12-11 17:27:22
问题 I'm using stellar.js to apply a parallax effect to a background image. The height of the container around the background image is set by javascript to the window height minus the height of the header. I have the background image set to cover in css and want it to fill the container regardless of the screen size. This works fine with no parallax effect, but once I apply the parallax effect the positioning changes, so when the container is tall the image doesn't fill it. I spoke to Mark

How to create Parallax Effect

由 ＊爱你＆永不变心＊ 提交于 2019-12-11 07:15:35
问题 How is this parallax effect done? Now let's say we had a paged UIScrollView and inside each page/section there was a UITableView and that image above with the cool parallax was inside of a UITableViewCell , so as you scroll left and right in the paged UIScrollView , you would see the parallax effect within the UITableViewCell 's. The parallax effect in this case would be horizontal like the video above, not vertical when scrolling up and down the UITableView . Could anyone please show or

Image motion when scrolling using jquery

由 那年仲夏 提交于 2019-12-11 06:25:35
问题 Can someone please suggest a tutorial/resource or give an example of basic image motion using jquery. I have been searching for a few weeks now via Google and trying various tutorials and templates and I am having difficulty finding an example of what I thought would be a simple animation. I am trying to figure out how to create an effect so as you scroll down the page, a small image moves from point A to point B. The motion could be diagonal, horizontal, vertical, etc. I just want to specify
订阅 parallax