모니터 해상도에따라 다른 최신글 불러오기가 가능한지요?
본문
해상도가 400 ~ 1024까지는 <?php latestsklin, 게시판-1..?>
해상도가 1024 이상일경우 <?php latestsklin, 게시판-2..?>
이런 방법이 가능할 런지요?
방법이 있다면 고수님들의 조언을 기다립니다.
감사합니다.
답변 10
/*1024 이상의 최근게시물 스킨을 감싸고 있는 div의 display를 block */
/*1024 이하의 최근게시물 스킨을 감싸고 있는 div의 display를 none*/
@media all and (max-device-width:1024px) {
/*1024 이상의 최근게시물 스킨을 감싸고 있는 div의 display를 none*/
/*1024 이하의 최근게시물 스킨을 감싸고 있는 div의 display를 block*/
}
css에 위의 내용을 적용시켜보세요.
감사합니다.
제가 필요한 것은 화면크기에 따라 최신글을 다르게 불러들이고 싶은 것입니다.
css에 정의한 후에 최신글을 부르는 방법을 알고 싶습니다.
고맙습니다.
<div id="newskin1">
<?php echo latest("스킨명", "테이블명", "4", "14", "1", "1024이하게시판");?>
</div>
<div id="newskin2">
<?php echo latest("스킨명", "테이블명", "4", "14", "1", "1024 이상게시판");?>
</div>
위와같이 메인에 적용을 시켯다면.
하단의 내용을 css안에 삽입합니다.
#newskin1{display:block}
#newskin2{display:none}
@media all and (max-device-width:1024px) {
#newskin2{display:block}
#newskin1{display:none}
}
반응형 웹 조금만 훑어보시면 쉽게 해결이 가능하실듯하네요.
<script>
function adjustStyle(width) {
width = parseInt(width);
if (width < 1024) {
<?php latestsklin, 게시판-1..?>
} else if ((width >= 400) && (width < 1024)) {
<?php latestsklin, 게시판-2..?>
} else {
}
}
$(function() {
adjustStyle($(this).width());
$(window).resize(function() {
adjustStyle($(this).width());
});
});
</script>
이런식으로 하면 되지 않을까요?
테스트는 안해봤습니다.
port443 님 고맙습니다.
어떻게 적용하는지 전혀 감을 잡을 수가 없습니다.
테스트를 어떻게 하면 되는지를 혹시 알려 주실 수 있으시면...
부탁드리겠습니다.
port443님 고맙습니다.
index.php 속에 넣고 시험을 했는데요.
못불러 오는데요.
그래도 감사합니다.
아 그렇다면 미리 두개를 불러온 상태에서 div 안에 bind 처리한 후에 hidden 또는 block 처리하면 되지 않을까요?
어차피 jQuery 안에 있으니까요
예를 들면
<div id='data1'>
<?php latest 어쩌구 1번 ?>
</div>
<div id='data2'>
<?php latest 어쩌구 2번 ?>
</div>
로 하시고 디폴트를 display:none 으로 하고
위의 해상도에 display:block 처리로 하는거죠
{ 속에 <?php latestsklin, 게시판-1..?> 최신글 불러오는 명령문을 인식하지 못하는 것 같습니다.
따옴표를 홋따옴표를 이리저리 해봐도 않됩니다.
고맙습니다.
아 그렇다면 미리 두개를 불러온 상태에서 div 안에 bind 처리한 후에 hidden 또는 block 처리하면 되지 않을까요?
어차피 jQuery 안에 있으니까요
죄송합니다
앞의 말씀이 무슨말이지 저는 모릅니다.
미안합니다.
음..
무조건적으로 답에만 의존하기보다는 검색을 해보시는것도 방법일거 같은데..
우선 페이지 구성이 어떻게 이루어지는지 부터 이해를 하심이 좋을거 같네요.
더이상 답변은 이해가 안되는 상태에서 홈페이지의 답을 제시하는 부분인거 같아 이어 하지 않겠습니다.
수고많으셨습니다.
<div id='data1'>
<?php latest 어쩌구 1번 ?>
</div>
<div id='data2'>
<?php latest 어쩌구 2번 ?>
</div>
로 하시고 디폴트를 display:none 으로 하고
위의 해상도에 display:block 처리로 하는거죠
이건 어디다 넣는건지?
미안합니다.
hikki 님 고맙습니다.
주신 소스로 시험을 해 보니 구분이 잘 되진 않습니다.
그러나 방향을 알 수 있을 것도 같습니다.
한번 노력해 보겠습니다.
감사합니다.
css
/* 화면크기에따라 최신글 별도로 */
#newskin2{display:block}
#newskin1{display:none}
@media all
and (min-device-width : 300px)
and (max-device-width:1024px) {
#newskin1{display:block}
#newskin2{display:none}
}
그리고 index.php
<!-- 최신글 시작 { -->
<div id="newskin1"> <!--1024이하 -->
<?php echo latest("최신글스킨-2", "보드",4, 40); ?>
</div>
<div id="newskin2"> <!--1024이상 -->
<?php echo latest("최신글스킨-1", "보드",4, 40); ?>
성공했습니다.
지원해주신 두분 고수님들께 감사를 드립니다.