Beste allen,

Momenteel ben ik met een site bezig waarbij ik gebruik maak van een soort Toggle waarbij een Div van links naar rechts (en andersom) schuift (open/close).
Nu werkt dit opzich prima alleen wil ik wel aparte buttons hebben voor het open en close, dus als hij open staat een pijl naar rechts en als hij dicht is een pijl naar links.

Ik heb alleen geen idee hoe ik dat binnen de bestaande javascript krijg, daarom jullie hulp gevraagd.

Ik hoor het graag als jullie een oplossing hiervoor hebben,
Alvast bedankt,
gr,
Chris

url: http://www*vankesselmo*nl/BU/overVKMO.html

2 maal toegevoegd

Misschien dat dit werkt:


<script>
$(document).ready(function()
{
$('#pollSlider-button_over').click(function() {
if($(this).css("margin-right") == "-364px")
{
$('.pollSlider_over').animate({"margin-right": '+=365'});
$('#pollSlider-button_dicht').animate({"margin-right": '+=364'});
}
else
{
$('.pollSlider_over').animate({"margin-right": '-=365'});
$('#pollSlider-button_over').animate({"margin-right": '-=364'});
}
});
});
</script>


En in je CSS toevoegen:


#pollSlider-button_dicht{
position:absolute;
width:18px;
height:18px;
right:366px;
background:url(../img/arrow_dicht.png) no-repeat;
top:507px;
z-index:100;
cursor:pointer;
}


En uiteraard ../img/arrow_dicht.png aanmaken.

Bedankt voor je reactie,

Ik heb het erin gezet, maar bij mijn werkt hij niet.

gr,
Chris

Zou ik mss een ander scrip moeten zoeken?
Het bestaat wel gewoon natuurlijk.

maak 1 img met de pijltjes onder elkaar,.

met de toggle in de jquery dus de background-position aanpassen

wat meer gebruikt wordt is een aparte class toevoegen dan addClass hasClass in de toggle
verwerken. hiervoor is eigenlijk geen apart script nodig zijn maar paar lines immers,,

hoi Steven,

bedankt voor je reactie,

Ik begrijp alleen niet helemaal wat je bedoelt, met de addClass hasClass in de toggle,

gr,
Chris

zie: http://api.jquery.com/toggle/

$(selector).toggle( "slow", function() {



/*
hier je background-position of een class toevoegen of verwijderen
*/

if( $(selector).hasClass("classname") )
{
$(selector).removeClass("classname");
}
else
{
$(selector).addClass("classname");
}




});


hoop dat het zo iets duidelijker wordt voor je ?

Hoi Steven,

bedankt!
Is dit gewoon toe te voegen in mijn huidige javascript?

gr,
Chris

Hoi Chris,

Dat is wel de bedoeling.. wel een class aanmaken in je css met de andere background image eh ?
bv :
.arrowdown
{
background: url(pad/naar/image) ;
}