GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → komomoo → vue-slim-cropper

komomoo / vue-slim-cropper

Licence: MIT license
💇‍♀️ A simple and elegant mobile image crop upload component for Vue 2.x | 简洁易用的 vue 移动端图片裁剪上传组件

Programming Languages

Vue
7211 projects
shell
77523 projects
javascript
184084 projects - #8 most used programming language

Labels

vuemobile-webimage-cropperimage-clip

Projects that are alternatives of or similar to vue-slim-cropper

Octoprint Touchui
A touch friendly interface for a small TFT module or phone
Stars: ✭ 226 (+564.71%)
Mutual labels:  mobile-web
px2rem.scss
Self adaption plugin for mobile development.
Stars: ✭ 18 (-47.06%)
Mutual labels:  mobile-web
vcrop
A simple Vue image cropping component.
Stars: ✭ 14 (-58.82%)
Mutual labels:  image-cropper
Keen Slider
The HTML touch slider carousel with the most native feeling
Stars: ✭ 3,097 (+9008.82%)
Mutual labels:  mobile-web
ngx-vant
Lightweight Mobile UI Components built on Vant and Angular
Stars: ✭ 34 (+0%)
Mutual labels:  mobile-web
ionic3-image-handling
In this ionic tutorial you will learn how to access the image gallery and take pictures from an ionic app. Also we will show you how to add a image cropper. This ionic tutorial includes a working ionic app example you can reuse for your needs.
Stars: ✭ 35 (+2.94%)
Mutual labels:  image-cropper
Swip
a library to create multi device experiments
Stars: ✭ 2,109 (+6102.94%)
Mutual labels:  mobile-web
angular-croppie
Angular 1.5+ Component for Croppie
Stars: ✭ 16 (-52.94%)
Mutual labels:  image-cropper
touchclick
Provides immediate visual feedback on touch for native-feeling web apps
Stars: ✭ 42 (+23.53%)
Mutual labels:  mobile-web
gestures
A library for normalized events and gesture for desktop and mobile.
Stars: ✭ 31 (-8.82%)
Mutual labels:  mobile-web
Uber Mobile Web
This is an attempt to mock the new uber app into mobile web to learn how react can be used to optimize for mobile web.
Stars: ✭ 235 (+591.18%)
Mutual labels:  mobile-web
mobile-scroll-events
📜 移动端滚动事件大起底！
Stars: ✭ 51 (+50%)
Mutual labels:  mobile-web
xcrop
Mobile image cropping component - Vue React 移动端裁剪组件
Stars: ✭ 27 (-20.59%)
Mutual labels:  image-cropper
Better Scroll
📜 inspired by iscroll, and it supports more features and has a better scroll perfermance
Stars: ✭ 15,199 (+44602.94%)
Mutual labels:  mobile-web
tinycrop
Pure JavaScript image crop library
Stars: ✭ 62 (+82.35%)
Mutual labels:  image-cropper
Moerail
铁路车站代码查询 × 动车组交路查询
Stars: ✭ 186 (+447.06%)
Mutual labels:  mobile-web
react-drop-n-crop
An opinionated implementation of react-dropzone and react-cropper
Stars: ✭ 17 (-50%)
Mutual labels:  image-cropper
vue-vant-template
A reliable mobile-web template built on Vue, Vue-CLI, Vuex, Vue-Router, Vant, Axios, Scss, Mock, Eslint and Viewport adaptation scheme. 基于 Vue 全家桶和 Vant 的 Web 移动端开发脚手架。
Stars: ✭ 15 (-55.88%)
Mutual labels:  mobile-web
scrollbounce
Add a subtle bounce effect on mobile when the user scrolls (WIP)
Stars: ✭ 17 (-50%)
Mutual labels:  mobile-web
editor-ovo
A rich text editor for mobile web. Mixed editing of photos and Emoji 一个适用于移动web的富文本编辑器。照片加emoji的混合编辑
Stars: ✭ 29 (-14.71%)
Mutual labels:  mobile-web
View All Similar Projects ➔

vue-slim-cropper

English | 简体中文

🌰 Example

Demo

Demo Source Code

🚀 QuickStart

  1. Install
yarn add vue-slim-cropper # OR npm i -S vue-slim-cropper
  1. Import
// main.js
import SlimCropper from 'vue-slim-cropper'
Vue.use(SlimCropper)
  1. Usage. Please refer to the Demo Source Code
<SlimCropper ref="cropper" :src=""></SlimCropper>

🔌 API

Props

Name Description Type Default
src image URL String undefined
aspectRatio width / height ratio Number 1
cropperOptions cropperjs options: https://github.com/fengyuanchen/cropperjs Object null

Methods

Name Description Parameters
getCroppedBlob get the cropped image blob object type = 'image/jpeg', quality = 1

😉😘 If it is helpful to you，please encourage me with a ⭐️Star ~

Changelog

License

MIT

Copyright (c) 2018-present, komo

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].