如何用jquery給li加邊框

思路：為添加邊框樣式設(shè)置一個(gè)class（設(shè)為selected），點(diǎn)擊li后使用removeClass()方法刪除其他li的selected類(lèi)，并且為當(dāng)前l(fā)i添加selected類(lèi)。

成都創(chuàng)新互聯(lián)專(zhuān)注于企業(yè)營(yíng)銷(xiāo)型網(wǎng)站、網(wǎng)站重做改版、中原網(wǎng)站定制設(shè)計(jì)、自適應(yīng)品牌網(wǎng)站建設(shè)、HTML5建站、商城建設(shè)、集團(tuán)公司官網(wǎng)建設(shè)、外貿(mào)網(wǎng)站制作、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)等建站業(yè)務(wù)，價(jià)格優(yōu)惠性?xún)r(jià)比高，為中原等各大城市提供網(wǎng)站開(kāi)發(fā)制作服務(wù)。

實(shí)例演示如下:

1、HTML結(jié)構(gòu)

style

ul.test li{display:inline-block;border:1px solid white;} ?/*默認(rèn)為白色邊框*/

.selected{border:1px solid #ff99cc !important;}

/style

ul class="test"

liGlen/li ? liTane/li ? ?liJohn/li ? ?liRalph/li

/ul

2、jquery代碼

$(function(){

$("li").click(function() {

$(this).siblings('li').removeClass('selected');????// 刪除其他li的邊框樣式

$(this).addClass('selected');????????????????????????????// 為當(dāng)前l(fā)i添加邊框樣式

});

});

3、效果演示

jQuery attr 設(shè)置的邊框?yàn)樯抖际呛谏?/h2>

jq的attr()是獲取屬性值或者修改屬性值函數(shù),不是修改樣式的，修改樣式直接使用css();

如：

html：

div?style="width:200px;?height:200px;"/div

JQ:

$("div").css("border","1px?solid?red");

這樣就設(shè)置了div的邊框?yàn)?px 實(shí)邊 紅色。

也可以直接設(shè)置其邊框顏色。如：

$("div").css({"border-color":"red","border-style":"solid"});

jQuery怎么實(shí)現(xiàn)改變div邊框和拖動(dòng)div？

script type="text/javascript"!--

$(document).ready(function()

{

$(".show").mousedown(function(e)//e鼠標(biāo)事件

{

$(this).css("cursor","move");//改變鼠標(biāo)指針的形狀

var offset = $(this).offset();//DIV在頁(yè)面的位置

var x = e.pageX - offset.left;//獲得鼠標(biāo)指針離DIV元素左邊界的距離

var y = e.pageY - offset.top;//獲得鼠標(biāo)指針離DIV元素上邊界的距離

$(document).bind("mousemove",function(ev)//綁定鼠標(biāo)的移動(dòng)事件，因?yàn)楣鈽?biāo)在DIV元素外面也要有效果，所以要用doucment的事件，而不用DIV元素的事件

{

$(".show").stop();//加上這個(gè)之后

var _x = ev.pageX - x;//獲得X軸方向移動(dòng)的值

var _y = ev.pageY - y;//獲得Y軸方向移動(dòng)的值

$(".show").animate({left:_x+"px",top:_y+"px"},10);

});

});

$(document).mouseup(function()

{

$(".show").css("cursor","default");

$(this).unbind("mousemove");

})

})

// --/script

jquery怎么設(shè)置右邊框的顏色？

首先獲取元素，然后使用css設(shè)置邊框顏色即可。

$("#test").css("border-right-color","red");

通過(guò)上面的設(shè)置，就可以將元素id是test的元素的右邊框設(shè)置成紅色。

如何用jQuery實(shí)現(xiàn)div邊框漸顯效果

1 先給div設(shè)置一個(gè)邊框div{border:2px solid #999;}

2 然后設(shè)置動(dòng)畫(huà)：

$("div").animate({

borderWidth:0,

padding:'2px'},1000)

文章標(biāo)題：jquery邊框,jquery設(shè)置邊框樣式
轉(zhuǎn)載來(lái)于：http://chinadenli.net/article3/dsipois.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供電子商務(wù)、全網(wǎng)營(yíng)銷(xiāo)推廣、商城網(wǎng)站、網(wǎng)站改版、用戶(hù)體驗(yàn)、微信公眾號(hào)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)