Flexslider Thumb Image Base 64

Question

Ich verwende die Flexslider-Komponente, um ein Karussell mit Thumbnails zu erstellen. Ich kann die Komponente normalerweise verwenden, wenn ich das Attribut data- mit dem Bildpfad verwende, jedoch habe ich nicht den Bildpfad, aber ich habe das Base64. Wie kann ich die Komponente mit Bildern in Base64 verwenden?

Unter meinem Code ohne Base64 arbeiten:

<div class="flexslider"> 
 
<div class="flex-viewport" style="overflow: hidden; position: relative;"> 
 
    <ul class="slides" style="width: 1200%; transition-duration: 0.6s; transform: translate3d(-2500px, 0px, 0px);"> \t 
 
     <div style="display: none;"> 
 
      <li data-thumb="images/si3.jpg" class="cnt-pi-model" aria-hidden="true" style="width: 625px; float: left; display: block;"> 
 
       <div class="thumb-image"> 
 
        <img src="images/si3.jpg" data-imagezoom="true" class="img-responsive" draggable="false"> 
 
       </div> 
 
      </li> 
 
     </div> 
 
    </ul> 
 
</div> 
 
<ol class="flex-control-nav flex-control-thumbs">          
 
    <li><img src="images/si3.jpg" draggable="false" class="flex-active"></li> 
 
</ol> 
 
<ul class="flex-direction-nav"> 
 
    <li class="flex-nav-prev"><a class="flex-prev" href="#">Previous</a></li> 
 
    <li class="flex-nav-next"><a class="flex-next" href="#">Next</a></li> 
 
</ul> 
 
</div>

Answer 1

Ich habe es durch einen generischen Handler zu machen, die die Base64 in ein Bild verwandelt, so dass die Komponente eine URL bekommen.