[JavaScript]po kliknieciu zmienia się obrazek Opcje

[jaca121212]

tak jak w temacie mam skrypt playlisty który po kliknieci odtwarza się muzyka i jest ikona play a chciałbym aby ta ikona zmieniła sie na inna ikonę tzn podmiana obrazka istniejącego na inny obtrazek w jaki to sposób zrobić

[JAVASCRIPT] pobierz, plaintext 
<script>
$("#playlist a").on("click", function() {
 
       var src = $(this).attr('href');
		var zdjecie1= document.getElementsByClassName(".icon-play");
		zdjecie1.innerHTML = "Hello World!";
        $("#videoarea").attr("src", src);
        $("#videoarea").attr("poster", '');
        $("#videoarea").attr("autoplay", true);
 
    return false;
});
 
 
 
 
 
});
 </script>
[JAVASCRIPT] pobierz, plaintext 

ikona play ma classe icon-play
ikona pauza ma classe icon-pause

Ten post edytował jaca121212 2.05.2015, 19:24:46

[tomek200]

To tak jak koledzy wyżej tylko zamiast podmieniać klasę to podmieniaj atrybut src zdjęcia.

[jaca121212]

To tak jak koledzy wyżej tylko zamiast podmieniać klasę to podmieniaj atrybut src zdjęcia.

efekt który osiągnąłem jest taki że pierwszy obrazek się nie ukrywa pod drugim a i tak zamisat w konkretnej komórce li zmienił się obrazek po kliknieciu to we wszystkich komórkach li się zmieniają jak to naprawić

[JAVASCRIPT] pobierz, plaintext 
(function(){
 
    var i = 0,
        $pauseIcon = $('.icon-pause');
 
    $('a').click(function(){
 
        $pauseIcon.toggleClass("off", i);
        i = i === 1? 0 : 1;
 
    });
 
})();
 
[JAVASCRIPT] pobierz, plaintext 

[PHP] pobierz, plaintext 
echo'<ul id="playlist">';
 
echo "<li><a href=muzyka/$fileinfo>$fileinfo</a>";
 
echo'<i class="icon-play" onclick="myFunction()"></i>';
echo'<i class="icon-pause off"></i>';
 
echo "</li>";
 
echo'</ul>';
[PHP] pobierz, plaintext 

[CSS] pobierz, plaintext 
.icon-play, .icon-pause{
        position: absolute;       
}    
.icon-play.off, .icon-pause.off{
        display: none;
 
}
.icon-play:before { content: '\e800';margin-left:550px;margin-top:-25px; margin-right:0px; float:left;} 
.icon-pause:before { content: '\e801'; margin-left:550px;margin-top:-25px; margin-right:0px; float:left;  } 
[CSS] pobierz, plaintext 

dodam że iconki są pobrane z fontello

Ten post edytował jaca121212 3.05.2015, 13:42:51