An AngularJS directive for WURFL Image Tailor (WIT)
WURFL Image Tailor (WIT) is an automatic image tailor based on WURFL device detection. WURFL will detect the device, and its screen size, resize and optimize the image accordingly.
##Features
- Add the img-wit directive
- Enable out of the box support for the WIT URLs to download more images in parallel.
- Allow use of the ngSrc directive
bower install angular-wurfl-image-tailor --save
- Include
angular-wurfl-image-tailor.js
. It should be located atbower_components/src/angular-wurfl-image-tailor.js
- Download Latest Version and extract the archive.
- Include
angular-wurfl-image-tailor.js
. It should be located atarchive_path/src/angular-wurfl-image-tailor.js
- Include the angular-wurfl-image-tailor directive dependency on your angular module:
var app = angular.module("demoapp", ["angular-wurfl-image-tailor"]);
- Include the markup directive on your HTML page, like this:
<img-wit src="http://yourserver.com/image.png"></img-wit>
or if you want to use the ngSrc directive:
<img-wit ng-src="{{myUrl}}"></img-wit>
where {{myUrl}} is the url of the trusted image to load.
Check the WURFL Image Tailor Documentation for the list of available settings.
<img-wit src="http://yourserver.com/image.png"></img-wit>
<img-wit src="http://yourserver.com/image.png" pc="20"></img-wit>
<img-wit src="http://yourserver.com/image.png" w="300"></img-wit>
<img-wit src="http://yourserver.com/image.png" w="200" h="200" m="letterbox_000000_100"></img-wit>
- Run:
npm start
- Browse:
http://localhost:8000/demo/index.html
$ npm test
Licensed under the MIT license. (See the LICENSE file)
Copyright © ScientiaMobile, Inc.