아보카도에 움직이는 배경 넣기 채택완료
안녕하세요!
https://codepen.io/GhostRider/pen/ZEeYxE 의 효과를 개인 홈페이지 배경에 넣고 싶은데요.
완전 초보라서 이렇게 하는 게 맞는 건지 궁금합니다.

이 내용을 복사해 메모장으로 만들고, 파일명을 confetti.css로 만들어 css 폴더에 넣고

마찬가지로 전문을 복사해 메모장으로 만들어 confetti.js로 만들고 js 폴더에 넣었습니다.
질문 1
그다음 CSS는 head.sup.php 파일에 아래 소스를 넣는 게 맞을까요?
<link rel="stylesheet" href="홈페이지 주소/css/confetti.css">
질문 2
js는 head.php 파일에 아래처럼 넣었습니다.
<script src="홈페이지 주소/js/confetti.js"></script>
질문 3
위에 두 개가 맞다면, 적어둔 소스를 head.sup.php 와 head.php 파일의 각각 어느 위치에 넣어야 하는지도 궁금합니다ㅠㅠ
참고용으로 php 파일 함께 업로드합니다.
https://drive.google.com/drive/folders/1xwgLqo510HLxiYfXbZOUQfK2hMndUwEN?usp=drive_link
(가문의 명예를 걸고 결코 아무 바이러스도 없는 클린한 파일입니다.)

질문 4
head.php 파일에 위에 저 html 코드도 넣어야 하는 것 같은데, 이건 어디에 넣어야 하는 걸까요?
정말 초보라 모르는 게 많습니다.. 도와주세요!!
답변 2개
답변에 대한 댓글 11개
마지막 html에 들어있는 스크립트 코드도 head.sup.php에 넣으시면 됩니다.
근데 다른 스크립트들과 충돌날 수 있으니 한번 적용해보시고, 뭔가 안된다 싶으면 이유를 찾아야합니다.
아 html에 코드에 있는 <div id="confetti"></div> 이건 원하는 페이지에 넣어야 하구요.
개인홈페이지 배경에 효과를 고정시키고 싶은 거라, 원하는 페이지라는 말이 이해가 안 됩니다!!
<div id="confetti"></div>
이걸 head.sup.php 에 넣었을 때는 배경에 뜨는데 index.php에 넣었을 때는 뜨지 않습니다 ㅠㅠㅠ
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ
<?php
include_once('./_common.php');
define('_INDEX_', true);
$main_link=get_main_link();
if (G5_IS_MOBILE) {
goto_url($main_link);
}
include_once('./head.sub.php');
add_stylesheet('<link rel="stylesheet" href="'.G5_CSS_URL.'/index.css">', 0);
?>
<? if($config['cf_bgm']) { // 배경음악 출력부분 ?>
<div id="site_bgm_box">
<iframe src="./bgm.php?action=play" name="bgm_frame" id="bgm_frame" border="0" frameborder="0" marginheight="0" marginwidth="0" topmargin="0" scrolling="no" allowTransparency="true" allow="autoplay; encrypted-media"></iframe>
</div>
<? } ?>
<!-- 콘텐츠 시작 -->
<div id="wrapper">
<iframe src="<?=$main_link?>" name="frm_main" id="main" border="0" frameborder="0" marginheight="0" marginwidth="0" topmargin="0" scrolling="auto" allowTransparency="true"></iframe>
</div>
<script>
$(document.body).on("keydown", this, function (event) {
if (event.keyCode == 116) {
document.getElementById('main').contentDocument.location.reload(true);
return false;
}
});
</script>
<?php
include_once(G5_PATH.'/tail.sub.php');
?>
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ
여기에서 어디에 <div id="confetti"></div> 를 넣어야 할까요??ㅠㅠㅠ
맨 위에도 넣어봤는데 뜨질 않습니다..
confetti 여기 css값에 z-index가 -1이기에 맨 뒤로 가 있는 상황이거든요.
id="wrapper" 여기에 백그라운드나 z-index가 있다면 가려져서 안보이는 상황일 수 있어요.
일단 실제 url을 보면.. 더 확실히 알 수 있을거같긴하네요.
말씀해주신대로 z-index를 1로 바꿨는데 새로고침 할 때만 저 배경 효과가 잠깐 뜹니다ㅠㅠ
댓글을 작성하려면 로그인이 필요합니다.
주사쟝님..! 아래 댓글이 안 달려서 이걸 확인하시면 여기에 댓글 부탁드려요!! ㅠㅠ
z-index를 1로 했더니 뜨긴..뜨는데..!!!
이번엔 효과가 앞에 있어서 그런지 메뉴나 관리 버튼이 안 눌립니다!!!!
하.... 왜이러는 걸까요??ㅠㅠ
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인