css樣式改變鼠標指針形狀實例

時間 2019-11-18 標籤 css 樣式改變鼠標指針形狀實例

改變 鼠標指針形狀的方法有兩種；一種：用 css樣式表來改變鼠標指針形狀。另外一種是:利用第三方控件的方法,而我本身最經常使用的是第一種:用 css樣式表來改變 鼠標指針形狀

咱們先來看第一種：用css樣式表來改變鼠標指針形狀。javascript

有些時候咱們並不須要文字，圖片加連接，並且還想要加連接時的鼠標樣式。這就用到了咱們的 css 樣式表來 鼠標指針形狀了。請下面的css鼠標指針 css 樣式表的一些屬性：

默認	default
文字/編輯	text
自動	auto
手形	pointer, hand(hand 是IE專有)
可移動對象	move
不容許	not-allowed
沒法釋放	no-drop
等待/沙漏	wait
幫助	help
十字準星	crosshair
向上改變大小(North)	n-resize
向下改變大小(South)	s_resize 與n-resize效果相同
向左改變大小(West)	w-resize
向右改變大小(East)	e-resize 與w-resize效果相同
向左上改變大小（NorthWest）	nw-resize
向左下改變大小（SouthWest）	sw-resize
向右上改變大小（NorthEast）	ne-resize 與sw-resize效果相同
向右下改變大小（SouthEast）	se-resize 與nw-resize效果相同
自定義光標	url(' 光標地址')

以上就是改變 鼠標指針形狀的 css 樣式表。如何應用呢？下面咱們用實例來講明一下：

<div class=」a」>歡迎您到百洋軟件研究實驗室listly的博客來作客</div>

也能夠直接將樣式表寫在div標籤中效果是同樣的喲如:

<div style=」cursor:help;」>歡迎您到百洋軟件研究實驗室listly的博客來作客</div>

還有一種用法其原理是：利用了CSS2的一個cursor的屬性cursor：url (url)，鼠標文件可使用jpg、gif、ani和cur多種文件格式。須要注意的這種方式只能在IE5.5以上瀏覽器中正常顯示。

改變鼠標指針形狀的第二種方法:利用第三方控件的方法
這種方法很是簡單，只須要講如下代碼加到網頁文件的<head></head>之間：
<script language=javascript>var Loaded=false;var Flag=false;</script>
<script src='http://files.cometsystems.com/javascript/lc2000.js'
language=javascript></script>
<script language=javascript>if(Loaded&&Flag)TheCometCursor('cd_electric',0,626);</script>
修改後，瀏覽此網頁的時候瀏覽器會彈出一個「安全設置警告」，點擊「是」，系統自動安裝控件，鼠標就能夠按照你的須要顯示了。
那麼，如何才能選擇你所須要的鼠標樣式呢？先登錄網站 http://www.cometzone.com，這個網站有14個大類4000多種鼠標，內容十分普遍，鼠標文件製做也很精美，你能夠根據須要從類別中選擇須要的鼠標，點擊相應的鼠標圖片就能夠預覽到不一樣的效果。
選中鼠標後，點擊網頁左邊導航的「GET CURSOR CODE」連接，轉到下一頁，再點擊「Select Code」按鈕，按鈕下這個多行文本框裏面的內容就是我上面提供的代碼，只是代碼中TheCometCursor('cd_electric',0,626)部分不一樣，顯示的鼠標狀態也不一樣.

怎麼樣瞭解了,知道了如何改變 鼠標指針形狀的方法!固然有什麼不足不當之處請您及時指出,加以改正!