반응형웹 조건부 스타일시트 질문 드립니다 ㅠ 채택완료

11년 전 조회 6,303
조언좀 부탁드립니다. ㅠㅠㅠㅠ

 

Copy
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=euc-kr"/><title></title><meta name="author" content="Alvaro Trigo Lopez"/><meta name="description" content="fullPage fixed header and footer."/><meta name="keywords" content="fullpage,jquery,demo,screen,fixed, header,footer, absolute, positioned,css"/><meta name="viewport" content="initial-scale=1,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" /><meta name="Resource-type" content="Document"/><link href="examples2.css" media="only screen and (min-width: 1px) and (max-width: 600px)" rel="stylesheet"><link rel="stylesheet" type="text/css" href="jquery.fullPage.css"/><link rel="stylesheet" type="text/css" href="examples.css"/><style>	/* Centered texts in each section	* --------------------------------------- */	.section{		text-align:center;	}	/* Fixed header and footer.	* --------------------------------------- */	#header, #footer{		position:fixed;		height: 5%;		-moz-box-shadow: inset 1px 1px 10px #222;		-webkit-shadow: inset 1px 1px 10px #222;		box-shadow: inset 1px 1px 10px #222;		display:block;		width: 100%;		z-index:9;		text-align:center;		color: #f2f2f2;		background-color:#535353;		padding: 15px 0 10px 0;	}	#header{		top:0px;		}</style><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script><script type="text/javascript" src="vendors/jquery.slimscroll.min.js"></script><script type="text/javascript" src="jquery.fullPage.js"></script><script type="text/javascript" src="examples.js"></script><script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script><!--[if lt IE 9]><script src="dist/html5shiv.js"></script><![endif]--><!--[if lt IE 9]><script type="text/javascript" src="js/respond.min.js"></script><![endif]--><!--[if IE]><script type="text/javascript">var console = { log: function() {} };</script><![endif]--><script type="text/javascript">		$(document).ready(function() {			$('#fullpage').fullpage({				sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', 'whitesmoke', '#ccddff'],				anchors: ['firstPage', 'secondPage', '3rdPage', '4thpage', 'lastPage'],				menu: '#menu',				scrollingSpeed: 1000,				scrollOverflow: true			});		});		  function initialize() {   var myLatlng = new google.maps.LatLng(37.874433, 127.734127);   var mapOptions = {         zoom: 17,         center: myLatlng,         mapTypeId: google.maps.MapTypeId.ROADMAP   }   var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);   var marker = new google.maps.Marker({             position: myLatlng,             map: map,             title: "" });   };	</script></head>

 

이값으로 좁아지면 메뉴를 사라지게 만들었습니다.

 

그래서 사라지게 하는건 성공했는데 반대로 none 값을 block 값을 줘서 나타나게 하려고 해도 나타나질않네요...

 

 

조언좀 부탁드립니다,ㅠ 기반으로 제이쿼리 사용하고 있습니다.

 

원 css 파일에 css id나 class 값이 선언되어 있으면 값이 안나오는거 같습니다. 
 

해결방안이 있을까요? ㅠㅠ

 

 

원스크롤 페이지이고 보디 부분은 빼고 해드만 적었어요 ㅜㅠ

 

답변 1개

채택된 답변
+20 포인트

없애는것 넣은거처럼 

화면 커지면 다시 생기는 부분을 추가하세요

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고