Zoom-Bibliothek funktioniert nicht vom Controller

Question

Frohes neues Jahr.

Ich benutze http://www.dfc-e.com/metiers/multimedia/opensource/jquery-fancyzoom/, was mir erlaubt, auf ein Bild von einem Daumennagel zu klicken und eine größere Version zu sehen, die als Overlay über dem angeklickten Daumennagelbild gezeigt wird. Ich kann dann das Bild schließen (über eine Schaltfläche close.png).

Der HTML-Code verwendet wird:

<% var url-small = Url.Action("GetThumbNail", new {id = item.ID });%> 
<% var url-large = Url.Action("GetLargeImage", new {id = item.ID });%> 

      <a href="<%: url-large %>"> 
       <img src="<%: url-small %>" alt="" height="50" width="50"/> 
      </a> 

Jetzt in meinem Controller ich habe:

public ActionResult GetLargeImage(int id) 
    { 
     byte[] imageData = repository.GetLargeImage(id);; 
     return File(imageData, "image/jpeg"); 
    } 

und meine GetThumbNail Aktion ist sehr ähnlich und gibt die Datei(). Dies funktioniert gut und zeigt das Thumbnail.

Wenn ich auf das Bild klicken, wird die Aktion "GetLargeImage" ausgeführt und das Bild wird auf einer neuen Seite angezeigt. Wenn ich url-large durch etwas wie "images/testimage.jpg" ersetze, dann wird das richtige Verhalten angezeigt, wenn ich auf das Bild des Daumennagels klicke, und testImage.jpg wird als ein Overlay (die gezoomte Version) auf demselben angezeigt Seite.

Es scheint also so, als würde die Verwendung des Controllers dazu führen, dass das große Bild nicht als Überlagerung, sondern in einer neuen Seite angezeigt wird.

Irgendwelche Ideen, warum das passiert?

JD

Answer 1

Meine erste Vermutung ist, dass dies ein Kopfproblem ist, so dass Ihre Zoom-Bibliothek es als Overlay nicht angezeigt werden. Finden Sie die Unterschiede zwischen den Headern der statischen Served-Images und den von Ihrem Controller gelieferten Images.

Sie können eine benutzerdefinierten ImageResult Klasse erstellen, müssen korrekte Header hinzufügen usw.

Answer 2

Sie nicht url-small und url-large als Variablennamen in C# (eine Variable enthalten, kann nicht -) haben können, so dass ich denke, Ihren eigentlichen Code ist nicht das, was Sie haben bisher gezeigt:

<a href="<%: Url.Action("GetLargeImage", new { id = item.ID }) %>"> 
    <img src="Url.Action("GetThumbNail", new { id = item.ID })" alt="" height="50" width="50"/> 
</a> 

Auch sollten Sie sicherstellen, dass es keine Javascript-Fehler gibt und das Plugin erfolgreich angewendet wird.