问题
I want to apply media query only when page scrolled xxxx pixels down Is there any way I can do that with media query without JS?
UPDATED The reason I am asking because none of JS plugins based on offset position are working on iPad, iPhone and Safari, they are not calculating offset properly Fixed position delayed on IOS and Bootstrap scrollspy not working on iPad
So I thought may be I can do that with media query if it is possible.
回答1:
No you can't do that with a media query, media queries are used to test screen sizes for responsive web design.
You're going to have to use javascript to check scroll position then apply the media query accordingly.
回答2:
you could use twitter bootstrap scrollspy method: http://getbootstrap.com/javascript/#scrollspy
回答3:
This isn't possible with Media Queries, but you are able to do this with JavaScript. If you're having issues with ScollSpy maybe take a look at Waypoints. This works on mobile and is an incredible library to have in your toolbelt. This will let you react to the user's scrolled position.
来源：https://stackoverflow.com/questions/20772689/apply-media-query-when-page-scrolled-without-js