How to make banner ads sticky on the bottom of the screen with a close button?
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 |
<style> .bannerbottom1{ border: 1px solid #ddd; margin-top: 0px; /* Prevent double borders */ background-color: #f6f6f6; padding: 12px; text-decoration: none; font-size: 18px; color: black; display: block; position: relative; margin:0px; } div:hover { background-color: #eee; } .close7 { background-color:yellowgreen; width:2em; height:1.3em; text-align:center; } .close7:hover {background: #bbb;} </style> </head> <body> <div id="main1bannerbottom" align="center"> <div class="close7" style="font-size:18px" align="right"><b>x</b></div> <div class="bannerbottom1">sdfsdf sf</div> </div> <script> var closebtns = document.getElementsByClassName("close7"); var i; for (i = 0; i < closebtns.length; i++) { closebtns[i].addEventListener("click", function() { this.parentElement.style.display = 'none'; }); } </script> |