parallax

问题 Hi I am trying to create a single webpage website. I was able to create the navigation on the right side using circle, but it does not show the title(which is the name of each part of the menu.) This webpage is example of the menu on the right side. http://jonathannicol.com/projects/parallax-scrolling/ Here is my CSS & HTML code: #fp-nav { position: fixed; z-index: 52; top: 50%; right: 15px; padding: 0 10px 0 0; -webkit-transition: opacity .3s 0s linear; -moz-transition: opacity .3s 0s linear

问题 I'm working on a new HTML5 CSS3 template which features a parallax scrolling header, as well as sticky navigation menu and a scroll to top link. I've gotten the elements working individually, however, there are a few CSS rules for the parallax header which are breaking the sticky navigation and scroll link, and it's doing my head in! The CSS rule: html { height: 100%; overflow: hidden; } Breaks the ability to use Javascript/jQuery scroll events $(window).scroll(function() { alert("Hello!"); }

问题 I am trying to custom a extension for Parallax Header. However, it's not working perfectly. The table header view always floats and overlaps cells. Extension code: extension UITableView { func addImageHeaderView(headerView headerView: UIView, height: CGFloat) { self.contentInset = UIEdgeInsetsMake(height, 0, 0, 0) self.contentOffset = CGPoint(x: 0, y: -height) self.tableHeaderView = headerView self.tableHeaderView?.frame = CGRect(x: 0, y: 0, width: self.bounds.width, height: height) } func

问题 I'm working on a client site and i'm currently having an issue firguring out how to make something work. the goal is to pause at the section and continue to scroll inside the iphone then continue to scroll once the iphone has finished scrolling. I have attempted to use position fixed on the section but obviously the body continues to scroll so I'm not sure if this is the right solution. I was wondering if this is something Skrollr could assist with as well. Does anyone have any ideas? I've

问题 I have written an efficient parallax script that is very smooth on mobile. However, it is only smooth if I am scrolling with my finger on the screen. When scrolling with my finger on the screen, the parallax is smooth. But the second I take my finger off and let the inertia take over, it starts lagging. But only when the inertia takes over. I'm thinking if there is some kind of scroll event that is fired often during inertial scroll. It does not appear to be the script causing the lag, it is

问题 I am trying to build a parallax website with react and react-router In most react-router examples I found, target dom node is replaced with Handler corresponding to the route. var routes = ( <Route handler={App} path="/"> <DefaultRoute handler={Home} /> <Route name="about" handler={About} /> <Route name="users" handler={Users} /> </Route> ); Router.run(routes, function (Handler) { React.render(<Handler/>, document.body); }); How can I render all the route handlers into single page and jump to

问题 I am playing with Parallax scrolling like on that nike site. So I have been using scrollTop to determine the user's vertical position on the page and then I've been adjusting element's positions based on the changes to that value. Here I round the scrollTop value and log it. I'll show the log later. var distance = 60*(Math.round($(window).scrollTop()/60)); console.log(distance); Then, on click, I call this function which scrolls to the scrollTop value that I've passed it. function goTo(n){

问题 Is it possible to make parallax effect of background image with css transitions? Parallax should be slower than scrolling, so something do slowing is needed - is it possible to do it with css? Or if not, how best to do it with js/jquery? I care about best performance script, because my webpage is little overloaded. Could someone tell or show how to do it? I will be very grateful. 回答1: CSS has a perspective property which you can combine with zoom to achieve an element "behind" or "in front of

问题 I'm trying to get a pure CSS parallax effect working without having a fixed background height. This has been described in a few places, but they have the common constraint that the background layer must have a fixed, known height. I would like to get the effect working without having a fixed, known height for the background due to some dynamic content. My minimal example is here: https://jsfiddle.net/yf8oyben/ #container { position: fixed; top: 0; left: 0; right: 0; bottom: 0; perspective:

问题 I am trying to build a view which will allow the user to scroll an Excel-like structure both horizontally and vertically. My initial idea was to put a RecyclerView (with LinearManager) into a HorizontalScrollView. But it does not seem to work. Here is my code: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v7.widget.Toolbar