Zoom and move image with Blazor - minimal javascript
Demo site https://blazorwheelzoom.azurewebsites.net/
Add nuget package iso8859.blazor.wheel-zoom
| server side blazor | webassembly blazor |
|---|---|
| in Pages/_Host.chtml | in wwwroot/index.html |
<body>
...
<script src="_content/iso8859.blazor.wheel-zoom/wheelzoomblazor.js"></script>
</body>for both in _Imports.razor
@using BlazorWheelZoomLibrary.Shared
Use the component in your razor page
<WheelZoom Image="/mire.png" width="500" height="500" />If you want a border
<div style="border: thin solid green; width: 510px; height: 510px; padding: 5px;">
<WheelZoom Image="/mire.png" width="500" height="500" />
</div>