모두가 어느 정도 악의적 인 광고를 보았고, 당신은 그것을 닫고 다시 나옵니다! 왜, JS가 당신에게 말할 것인가
HTML
<body> <h3> undead xiaoqiang! </h3> <div id = "middlebox"> <a href = "javaScript :;" id = "closeBtn"> <img src = "images/close_icon.png"> </a> <ul> <li> <a href = "/"> <img src = "images/icon_tel.gif"> <span> call </span> </a> </li> <li> <a href = "/"> <img src = "images/icon_chat.gif"> <span> 빠른 메시지를 남겨주세요 </span> </a> </li> </div> </body>
CSS
*{마진 : 0; 패딩 : 0; 목록 스타일 : 없음; 개요 : 없음; 박스 사이징 : 국경 박스; 텍스트 결정 : 없음;} a {-webkit-touch-callout : none; Text-Decoration : None} : Focus {개요 : 0} Body {Font-Family : Helvetica, Stheiti, "Microsoft Yahei", Sans-Serif; 색상 : #595757; 배경색 : #fff; 개요 : 0; 오버 플로우 -X : 숨겨진; -webkit-tap-highlight-color : rgba (0,0,0,0);} img {border : none;}. Whitecolor {color : #ffff; Text-Align : Center;}. flex_parent {display : -webkit-box; 디스플레이 : -moz -box; 디스플레이 : -ms -flexbox; 디스플레이 : -webkit -flex; 디스플레이 : flex;}. flex_child {-webkit-box-flex : 1; -moz-box-flex : 1; -webkit-flex : 1; -ms-flex : 1; flex : 1;}/*middle_box*/body {위치 : 상대; 배경색 : #272822;} #미들 박스 {너비 : 260px; 높이 : 248px; 여백 : 0 Auto; 배경 이미지 : url (../ images/irfa_dog.jpg); 배경 반복 : 비 반복; 배경 크기 : 100% 100%; Border-Radius : 10px; /*수평 수직 센터링*/ 위치 : 고정; 왼쪽 : 50%; 상단 : 50%; 마진 -탑 : -124px; -webkit 변환 : Translatex (-50%); -Moz 변환 : TranslateX (-50%); -o-transform : translatex (-50%); -ms-transform : Translatex (-50%); 변환 : translatex (-50%); z-index : 100;}. close_btn {display : 블록; 오버플로 : 숨겨진; 위치 : 절대; 상단 : -10px; 오른쪽 : -10px;}. will_close {너비 : 32px;}#middlebox a {오버 플로 : 숨겨진;}#미들 박스 A img,#middlebox a span,#middlebox ul li {float : left;}#middlebox span {font -size : 16px; 색상 : #ffff;}#middlebox ul {오버 플로우 : hidden;}#middlebox ul li {너비 : 130px;}#middlebox ul li a {line-height : 50px; 디스플레이 : 블록; 왼쪽 패딩 : 5px;}#Middlebox ul Li a img {너비 : 30px; 마진 오른쪽 : 2px; 마진-탑 : 8px; 마진-왼쪽 : 5px;}. BTN_TEL {배경색 : #f92665; Border-Bottom-Left-Radius : 10px;}. btn_chat {배경색 : #1EA362; Border-Bottom-Right-Radius : 10px;}. Parent_btn {위치 : 절대; 왼쪽 : 0; 하단 : 0;}JS
/*** 2016/7/19에 관리자가 작성했습니다. */var adv = {div : null, 타이머 : null, btn : null, init : function () {this.btn = document.getElementById ( "closeBtn"); this.div = document.getElementById ( "미들 박스"); this.btn.onclick = this.displaynone; }, displayBlock : function () {adv.div.style.display = "block"; }, displayNone : function () {adv.div.style.display = "none"; timer = settimeout (function () {adv.displayBlock ();}, 3000); }}; window.onload = function () {adv.init ();};위는이 기사의 모든 내용입니다. 모든 사람의 학습에 도움이되기를 바랍니다. 모든 사람이 wulin.com을 더 지원하기를 바랍니다.