react-medium-image-zoom - Medium.com style image zoom for React

  •        278

This library is a different implementation of Medium.com's image zoom that allows for a low-res and high-res images to work together for โ€œzoomingโ€ effects and works regardless of parent elements that have overflow: hidden or parents with transform properties. Versions >=3.0.0 are compatible with React.js >=16.x; if you need compatibility with react@^0.14.0 || ^15.0.0, please use version 2.x. You can view the demo here.

https://github.com/rpearce/react-medium-image-zoom#readme
https://github.com/rpearce/react-medium-image-zoom

Tags
Implementation
License
Platform

   




Related Projects

react-native-photo-view - Pinch-to-zoom view for React Native (both iOS and Android)

  •    Objective-C

Provides custom Image view for React Native that allows to perform pinch-to-zoom on images. Works on both iOS and Android. This component uses PhotoDraweeView for Android and MWPhotobrowser on iOS.

react-native-image-zoom - react native image pan and zoom

  •    TypeScript

Then, scan the QR, use your expo app.

react-mapbox-gl - A React binding of mapbox-gl-js

  •    TypeScript

If those properties changed at the mapbox-gl-js level and you don't update the value kept in your state, it will be unsynced with the current viewport. At some point you might want to update the viewport value (zoom, pitch or bearing) with the ones in your state but using value equality is not enough. Taking zoom as example, you will still have the unsynced zoom value therefore we can't tell if you want to update the prop or not. In order to explicitly update the current viewport values you can instead break the references of those props and reliably update the current viewport with the one you have in your state to be synced again. Please try to reproduce your problem with the boilerplate before posting an issue.

photo_view - ๐Ÿ“ธ Easy to use yet very customizable zoomable image widget for Flutter

  •    Dart

A simple zoomable image/content widget for Flutter. PhotoView enables images to become able to zoom and pan with user gestures such as pinch, rotate and drag.


zoom.js - Medium's Image Zoom for jQuery

  •    Javascript

A simple jQuery plugin for image zooming; as seen on Medium. It's the best way to zoom an image. It transitions/zooms in really smoothly, and then when you're done, scrolls away, [esc] keys away, clicks away… clean af.

react-native-lightbox - Images etc in Full Screen Lightbox Popovers for React Native

  •    Javascript

navigator property is optional but recommended on iOS, see next section for Navigator configuration. For android support you must pass a reference to a Navigator since it does not yet have the Modal component and is not on the official todo list. See the Example project for a complete example.

react-native-image-gallery - Pure JavaScript image gallery component for iOS and Android with high-performance and native feeling in mind

  •    Javascript

A pure JavaScript image gallery component for React Native apps with common gestures like pan, pinch and doubleTap, supporting both iOS and Android. This component utilizes @ldn0x7dc/react-native-view-pager as the scrollable container and react-native-transformable-image as the wrapped image.

react-native-image-progress - Progress indicator for networked images in React Native

  •    Javascript

Note: Progress indicators has been broken out to a separate component; react-native-progress. To use them, please follow installation instructions for that package. Note: onLoad* events are bubbled up, so if you want to do some custom thing when the image is loaded for example.

reaviz - ๐Ÿ“Š Data visualization library for React based on D3

  •    TypeScript

REAVIZ is a modular chart component library that leverages React natively for rendering the components while using D3js under the hood for calculations. The library provides an easy way to get started creating charts without sacrificing customization ability.

StfalconImageViewer - A simple and customizable Android full-screen image viewer with shared image transition support, "pinch to zoom" and "swipe to dismiss" gestures

  •    Kotlin

A simple and customizable full-screen image viewer with shared image transition support, "pinch to zoom" and "swipe to dismiss" gestures. Compatible with all of the most popular image processing libraries such as Picasso, Glide etc. Based on PhotoView by chrisbanes. Need iOS and Android apps, MVP development or prototyping? Contact us via info@stfalcon.com. We develop software since 2009, and we're known experts in this field. Check out our portfolio and see more libraries from stfalcon-studio.

react-native-image-resizer - ๐Ÿ—ป Resize local images with React Native

  •    Objective-C

A React Native module that can create scaled versions of local images (also supports the assets library on iOS). Note: on latest versions of React Native, you may have an error during the Gradle build on Android (com.android.dex.DexException: Multiple dex files define Landroid/support/v7/appcompat/R$anim). Run cd android && ./gradlew clean to fix this.

react-progressive-image - React component for progressive image loading

  •    Javascript

If you use the UMD build you can find the library on window.ReactProgressiveImage.react-progressive-image exports a single React component, ProgressiveImage, which takes a src and placeholder prop, as well as an optional onError function.

react-native-gallery - A pure JavaScript image gallery component for react-native apps with common gestures like pan, pinch and doubleTap, supporting both iOS and Android

  •    Javascript

A pure JavaScript image gallery component for react-native apps with common gestures like pan, pinch and doubleTap, supporting both iOS and Android. This component works on react-native 0.28+ and only supports remote images for now.

JQuery Zoom - jQuery plugin for zooming images on mouseover

  •    JQuery

A small jQuery plugin for zooming images on mouseover or mousedown.

TileView - TileView is a subclass of android

  •    Java

The TileView widget is a subclass of ViewGroup that provides a mechanism to asynchronously display tile-based images, with additional functionality for 2D dragging, flinging, pinch or double-tap to zoom, adding overlaying Views (markers), built-in Hot Spot support, dynamic path drawing, multiple levels of detail, and support for any relative positioning or coordinate system. Properly configured, TileView can render tiles quickly enough be appear seamless.

react-simple-img - ๐ŸŒ… React lazy load images with IntersectionObserver API and Priority Hints

  •    Javascript

Image component working similar with standard img tag and with the following props. This function is only required, when you want to customise intersection observer configuration.