https://github.com/payalord/xzoom

jQuery Zoom Gallery plugin
https://github.com/payalord/xzoom

gallery image jquery jquery-plugin zoom

Last synced: about 3 hours ago
JSON representation

jQuery Zoom Gallery plugin

• Host: GitHub
• URL: https://github.com/payalord/xzoom
• Owner: payalord
• License: apache-2.0
• Created: 2017-03-14T23:50:43.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2021-05-08T21:17:19.000Z (over 3 years ago)
• Last Synced: 2024-11-10T19:18:57.424Z (7 days ago)
• Topics: gallery, image, jquery, jquery-plugin, zoom
• Language: JavaScript
• Homepage: https://payalord.github.io/xZoom/
• Size: 1.64 MB
• Stars: 165
• Watchers: 14
• Forks: 65
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
[![Build Status](https://travis-ci.org/payalord/xZoom.svg?branch=master)](https://travis-ci.org/payalord/xZoom) [![npm](https://img.shields.io/npm/v/xzoom.svg)](https://www.npmjs.com/package/xzoom) [![GitHub license](https://img.shields.io/badge/license-Apache%202-blue.svg)](https://raw.githubusercontent.com/payalord/xZoom/master/LICENSE) [![Donate](https://img.shields.io/badge/Donate-PayPal-green.svg)](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=ASVGPLVSMYY6U) [![Donate Bitcoin](https://img.shields.io/badge/Donate-Bitcoin-orange.svg)](https://payalord.github.io/xZoom/donate-bitcoin/?amount=5&currency=USD)

# xZoom

jQuery Zoom Gallery plugin.

* Supports jQuery starting from version 1.2.6.

* A lof of options, effects and easy to use and customize

* Lightweight ~14kb minified version.

* You can load low and high res images separately.

* Supports IE6+, Chrome, FireFox, Opera, Safari, Android, iOS

* Supports Responsive output.

* Have an API to integrate with other useful plugins like [FancyBox](http://www.fancyapps.com/fancybox/), [Magnific PopUp](http://dimsemenov.com/plugins/magnific-popup/) and [HammerJS](http://hammerjs.github.io/).

# Installation

Use one of the following methods:

* `git clone [email protected]:payalord/xZoom.git`

* `git clone https://github.com/payalord/xZoom.git`

* `npm install xzoom`

* `bower install xzoom`

* [Download zip](https://github.com/payalord/xZoom/archive/master.zip)

* Use CDN:

  * `https://unpkg.com/xzoom/dist/xzoom.min.js`

  * `https://unpkg.com/xzoom/dist/xzoom.css`

# Quick Start

### Step 1:

1. Copy `xzoom.min.js` or `xzoom.js` file into your javascript folder.

2. Copy `xzoom.css` file into your css folder, or copy the content of the `xzoom.css` file into your site style sheet.

3. Copy `example/images/xloading.gif` to your images folder.

### Step 2:

This goes into your site's Header Section:

```javascript

```

### Step 3:

Add xZoom markup into your HTML:

```javascript





  

    

  

  

    

  

  

    

  

  

    

  



```


### Step 4:

Initialize the plugin in "document ready" section of your javascript or at the end before `