1. 程式人生 > >JS網站右下角懸浮視窗可關閉廣告

JS網站右下角懸浮視窗可關閉廣告

效果體驗:http://hovertree.com/texiao/js/4.htm

網站右下角懸浮視窗可關閉廣告程式碼,可收縮、展開,關閉,內容區可自定義html,相容IE8+、FireFox、Chrome、Safari等主流瀏覽器。廣告圖片尺寸300x250。



使用方法:
在head區域引入樣式表文件hvtcss4.css和JS檔案hvtjs4.js
注意: 
<link href="http://hovertree.com/texiao/js/4/hvtcss4.css" rel="stylesheet" type="text/css" />
不能寫成
<link href="http://hovertree.com/texiao/js/4/hvtcss4.css" rel="stylesheet" type="text/javascript" />

否則在IE和火狐瀏覽器將無法實現效果,在Chrome中卻可以。

在你的網頁程式碼中加入<!-- 程式碼 開始 --><!-- 程式碼 結束 -->區域部分

HTML檔案程式碼:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JS右下角懸浮可最小化和關閉的廣告 - HoverTree</title><base target="_blank" />
<link href="http://hovertree.com/texiao/js/4/hvtcss4.css" rel="stylesheet" type="text/css" />
<script src="http://hovertree.com/texiao/js/4/hvtjs4.js"
></script> <style>a{color:blue;}.hvtcenter{width:760px;margin:0px auto;}</style> </head> <body> <div class="hvtcenter"> <h2>右下角懸浮可最小化和關閉的廣告</h2> <a href="http://hovertree.com">首頁</a> <a href="http://hovertree.com/texiao/">更多特效</a> <
a href="http://hovertree.com/hvtart/bjae/yjm6v683.htm">原文</a> <a href="http://keleyi.com">柯樂義</a> <br />網站右下角懸浮視窗可關閉廣告程式碼,可收縮、展開,關閉,內容區可自定義html,相容IE8+、FireFox、Chrome、Safari等主流瀏覽器。廣告圖片尺寸300x250。 </div> <!-- 程式碼 開始 --> <div class="float_layer_hovertree" id="hovertree_float_layer" style="z-index:10001;"> <h2> <b>最新活動</b> <a id="btn_min" href="javascript:;" class="min" target="_self"></a> <a id="btn_close" href="javascript:;" class="close" target="_self"></a> </h2> <div class="content"> <div class="wrap"> <a href="http://hovertree.com/menu/texiao/" target="_blank"><img src="http://hovertree.com/texiao/js/4/hovertree_300x250.jpg" width="300" height="250" /></a> </div> </div> </div> <!-- 程式碼 結束 --> </body> </html>

相關推薦

JS網站右下懸浮視窗關閉廣告

效果體驗:http://hovertree.com/texiao/js/4.htm網站右下角懸浮視窗可關閉廣告程式碼,可收縮、展開,關閉,內容區可自定義html,相容IE8+、FireFox、Chrome、Safari等主流瀏覽器。廣告圖片尺寸300x250。使用方法:在head區域引入樣式表文件hvtcss

CSS固定定位實現右下關閉廣告

程式碼:<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="UTF-8"> <title>Title</title> <style>

(40)JS運動之右下懸浮

<!DOCTYPE HTML> <!-- --> <html> <head> <meta charset="utf-8"> <title></title> <style>

jQuery實現網頁右下懸浮層提示

off eight slide ring height containe htm enter else 最近有同事提到類似網頁右下角的消息懸浮提示框的制作。我之前也做過一個類似的例子,很簡單。是仿QQ消息。現在感覺之前的那個例子只是說了實現原理,整體上給你的感覺還是太醜,今

簡單網站側邊懸浮圖片帶關閉按鈕廣告程式碼

   邯鄲生活網www.mlhd.org 最近在放一個側邊的廣告,網上看很多程式碼都很複雜,其實有一款比較簡單的程式碼,也不需要呼叫更多的檔案就可以,還帶關閉按鈕,足以滿足將圖片廣告放入網站的側邊,左側右側均可。 程式碼如下: <!-- 浮動廣告程式碼開始 --&g

Swift右下懸浮按鈕簡單實現

最近想在自己的專案中新增一個右下角的懸浮按鈕,這種按鈕最初是在安卓中興起來的,但是再很多iOS App中都能看到它身影, 下面就推薦一個比較適合新手使用的懸浮按鈕例子ActionButton。(在GitHub上翻出來的) GitHub:https://github.com/lou

JS寫煩人右下的彈窗小廣告

啦啦啦啦,寫一下最近JS的學習進度。 最近JS學了DOM、正則、定時器… 用定時器寫了一個右下角的彈窗廣告。 先寫一下定時器的基本概念 週期定時器:setInterval(function,每間隔多少s執行) 一次定時器:setTimeout(function,間隔多少s執行一次)

關閉upupoo懸浮視窗

一個很好的動態桌面背景軟體,就因為無法關掉懸浮窗使得使用者特別難受. 特別是我這種強迫症max的人,恨不得解除安裝它! 電腦需要安裝火絨 有360可以用它的彈窗攔截功能,不過推薦火絨,360監守自盜,自己彈窗特別噁心. 上圖: 開啟擴充套件工具->彈窗攔截 新增攔

視窗右下訊息彈出框

<!DOCTYPE html> <html> <head> <title>視窗右下角訊息彈出框</title> <meta charset="utf-8"/> <style> *{marg

點選窗體關閉按鈕最小化到windows系統右下的方法

創建於 2012-05-05 遷移自個人的百度空間 -------------------------------- 步驟一:在FormClosing事件中新增如下程式碼   e.Cancel = true; 步驟二:在窗體裡拖一個工作列圖示的控制元件,設定它的圖示,然後讓窗體隱

js右下彈出提示框示例程式碼

廢話不多說,直接上程式碼 html頁面程式碼:    <div id="message-window" class="message-window" style="display:block;">       

JS彈出框、對話方塊、提示框,JS關閉視窗關閉頁面和JS控制頁面跳轉

1. RequestDispatcher.forward() 在伺服器端起作用,當使用forward()時,Servlet engine傳遞HTTP請求從當前的Servlet或者是JSP到另外的一個Servlet、JSP 或普通HTML檔案,也即你的form提交至a.jsp,在a.jsp用到了forw

如何關閉CSDN右下的小廣告

純屬無聊,年前給自己挖了幾個坑,有幾篇部落格要寫,但是不知道怎麼回事CSDN廣告不能被去廣告外掛攔截,而且手動也關不掉,就這麼點螢幕,被廣告死死佔據一塊,很麻煩。 右下角出這種各種有的沒有的廣告,煩都煩死人了,還佔地方。 想著怎麼去掉這些廣告 1、去廣告外掛 不論是使用Ch

Android新增拖動、點選的懸浮視窗

原文地址:http://mobile.9sssd.com/android/art/1288,貌似這個地址也不是原創不過我是看的這個。。就這個吧。。。這個例子蠻不錯,簡單易懂,註釋也很全,只是執行之後發現有個小bug,往左上角拖動的時候會執行點選事件,造成的原因也很簡單,就是

使用js彈出模態視窗,提交儲存資料後關閉模態視窗,重新整理父視窗

首先,點選按鈕彈出模態視窗    <input type="button"  value="修改個人資訊" onclick="modify();"/>   function modify(){       var obj=window.showModalDial

【手機UI】搜尋輸入框,撥出軟鍵盤時右下為搜尋按鈕,並使用js傳送請求

<!DOCTYPE html> <html> <head> <title>搜尋</title> <meta http-equiv="C

js右下通知提示框的實現

1、需要在頁面的body中載入彈出的方法: <body onLoad="document.getElementById('tip').style.height='0px';start()"> 2、需要把提示的div放到頁面的底部 <div id="t

經典的右下圖片 彈出程式碼 JS程式碼

<SCRIPT Language=Javascript> <!-- var oPopup = window.createPopup(); var popTop=40; function popmsg(msgstr){ var winstr="<tabl

Web右下彈出框提示,疊加

前言 一直想著對自己的平時學習以及工作做個總結與積累,無奈老夫實在憊懶。近幾日因為工作上的一些事被刺激到了,感覺和打了雞血一般:老夫要努力學習,勤奮向上。因為第一次寫部落格,可已經工作一年有餘,所以記錄的都是近年的工作學習上的一些心得,記錄時間有點挨近,此事忽

Android中自由移動懸浮視窗的實現

本文為參加Google暑期大學生部落格分享大賽特別撰寫。 —————————————————————- 大家對懸浮窗概念不會陌生,相信每臺電腦桌面的右上角都會有這麼一個東西,它總是出現在所有頁面的頂端(Top Show)。但在Android平臺中如何實