click on Image display image on new window

user_2556605 0
Viewed 11265

I get data from the database in which is images and some other fields, now I want that when I click on the Image they open in the new window my code is

<a target="_blank" href="#">
                  <img alt="" src="<%#"data:Image/png;base64,"+Convert.ToBase64String((byte[])Eval("ImageData"))  %>"" width="200" height="200" />

             </a>

what should I do this img pass to next window and display large or actual size

css html
3 Answers

You need to add some javascript to your code.

// HTML

 <a target="_blank" href="#" onClick='test(this)'>
 <img alt="" src="<%#"data:Image/png;base64,"+ Convert.ToBase64String((byte[])Eval("ImageData"))  %>"" />
 </a>

// Javascript Code

 function test(element) {
        var newTab = window.open();
        setTimeout(function() {
            newTab.document.body.innerHTML = element.innerHTML;
        }, 500);
        return false;
    }

Demo Fiddle

user_33157440

You can do by this:

// html

<a target="_blank" href="#" onClick='zoom(this)'>
 <img alt="" id="choicedPhoto" src="<%#"data:Image/png;base64,"+ Convert.ToBase64String((byte[])Eval("ImageData"))  %>"" />
 </a>

// script

function zoom(element) {
         var newTab = window.open();
         var data = document.getElementById("choicedPhoto").getAttribute("src");
         setTimeout(function () {
             newTab.document.body.innerHTML = "<img src='" + data + "'>";
         }, 500);
         return false;
     }

you have no size limit (as original img)

user_58470540
Related