jquery per modificare l'attributo di stile di una classe div

87

Ho una classe di scorrimento come questa e desidero modificare l'attributo style style = "left: 336px"

<div id="range-cont">
<div class="slider">
<div class="progress" style="width: 350px;"></div>
    <a class="handle" href="#" **style="left: 336px;"**></a>
</div>
<input id="percentage" class="range" type="range" value="14" name="percentage" min="0" max="100">
<p id="percent-label">%</p>
</div>
</div>

Ho provato $('.handle').css({'style':'left: 300px'})ma non funziona. Non sono sicuro di cosa sto facendo di sbagliato qui

javascript jquery css

— Anurag Sharma
fonte

154

Prova $('.handle').css('left', '300px');

— Ganesh D
fonte

84

se vuoi solo impostare l'attributo style usa

$('.handle').attr('style','left: 300px');

Oppure puoi usare il metodo css di jQuery per impostare solo una proprietà di stile css

$('.handle').css('left', '300px');

O uguale al valore chiave

$('.handle').css({'left': '300px', position});

Maggiori informazioni su W3schools

— Il codice
fonte

2

questa è una risposta più completa e migliore di quella selezionata

— Nicola Pedretti

$('.handle').prop('style','left: 300px');sta lavorando troppo

— Nurkartiko

8

Prova con

$('.handle').css({'left': '300px'});

Invece di

$('.handle').css({'style':'left: 300px'})

— Raghuveer
fonte

@dev aggiornato ora controlla che funzionerà di sicuro, ho rimosso erroneamente le parentesi

— Raghuveer

7

$('.handle').css('left', '300px');

$('.handle').css({
    left : '300px'
});

$('.handle').attr('style', 'left : 300px');

o usa OrnaJS

— Дима Попов
fonte

4

$('.handle').css('left','300px') prova questo, prima l'identificatore poi il valore

di più su questo qui:

http://api.jquery.com/css/

— q99
fonte

2

questo è utile per te ..

$('.handle').css('left', '300px');

— Sridhar R
fonte

2

Lo stile è un attributo, quindi cssnon funzioneràattr

Modificare:

$('.handle').css({'style':'left: 300px'});

T0:

$('.handle').attr('style','left: 300px');//Use `,` Comma instead of `:` colon

— Somnath Kharat
fonte

2

Non puoi usare $('#Id').attr('style',' color:red'); e $('#Id').css('padding-left','20%');
allo stesso tempo.
Puoi usare attr o css ma entrambi funzionano solo quando vengono usati da soli.

— Kavya Hanumantharaju
fonte

0

Per cambiare l'attributo della classe in modo condizionale,

var css_val = $(".handle").css('left');
if(css_val == '336px')
{
  $(".handle").css('left','300px');
}

Se l'ID viene fornito come segue,

<a id="handle" class="handle" href="#" style="left: 336px;"></a>

Ecco una soluzione alternativa:

var css_val = $("#handle").css('left');
if(css_val == '336px')
{
  $("#handle").css('left','300px');
}

— persec10000
fonte