在特定div之前停止浮动div(通用)

时间:2017-06-27 17:54:29

标签: javascript jquery html css

我试图使div浮动,然后在特定div之前停止(在这种情况下;页脚),它在我的屏幕上工作,但是当在更大的屏幕中尝试时,浮动div更高一些。 / p>

我也想避开每个特定屏幕的媒体屏幕。



		$window.scroll(function() {
	
		ws_cart = $(this).scrollTop();
	
		var cart_position = $('.product_desc').position();
		var footer_position = $('.footer_position').position();
		// alert('width__>'+scWidth+' height __> '+ scHeight);
		// alert(ws_cart+'<__>'+footer_position.top);
		// alert(footer_position.top-350);
		// alert(ws_cart);
		if (scWidth >= 1024 && scWidth <= 1125) {
	
			if (ws_cart > (cart_position.top + 65)) {
				$('.product_fixed').css({
					"position" : "fixed",
					"right" : "1.6em",
					"top" : "0px",
					"z-index" : "999",
					"background" : "#fff"
				});
	
			} else {
				$('.product_fixed').css({
					"position" : "relative",
					"top" : "",
					"right" : "0",
					"width" : "320px"
				});
	
			}
	
			if (ws_cart > (cart_position.top + 65)
					&& ws_cart > (footer_position.top - 624)) {
	
				$('.product_fixed').css({
					"position" : "relative",
					"right" : "0",
					"top" : "146em",
					"height" : "600px",
					"z-index" : "999",
					"background" : "#fff"
				});
			}
		} else if (scWidth >= 1125 && scWidth <= 1199) {
	
			if (ws_cart > (cart_position.top + 65)) {
				$('.product_fixed').css({
					"position" : "fixed",
					"right" : "1.6em",
					"top" : "0px",
					"z-index" : "999",
					"background" : "#fff"
				});
	
			} else {
				$('.product_fixed').css({
					"position" : "relative",
					"top" : "",
					"right" : "0",
					"width" : "320px"
				});
	
			}
	
			if (ws_cart > (cart_position.top + 65)
					&& ws_cart > (footer_position.top - 460)) {
	
				$('.product_fixed').css({
					"position" : "relative",
					"right" : "0",
					"top" : "90em",
					"height" : "600px",
					"z-index" : "999",
					"background" : "#fff"
				});
			}
	
		} else if (scWidth >= 1200 && scWidth <= 2560) {
	
			if (ws_cart > (cart_position.top + 65)) {
				$('.product_fixed').css({
					"position" : "fixed",
					"right" : "1.6em",
					"top" : "0px",
					"z-index" : "999",
					"background" : "#fff"
				});
	
			} else {
				$('.product_fixed').css({
					"position" : "relative",
					"top" : "",
					"right" : "0",
					"width" : "320px"
				});
	
			}
	
			if (ws_cart > (cart_position.top + 65)
					&& ws_cart > (footer_position.top - 512)) {
	
				$('.product_fixed').css({
					"position" : "relative",
					"right" : "0",
					"top" : "102em",
					"height" : "520px",
					"z-index" : "999",
					"background" : "#fff"
				});
			}
	
		}
	
	});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
&#13;
&#13;
&#13;

0 个答案:

没有答案