Comments (2)
Sure.
The following set of attributes:
<div class="fotorama"
data-width="500"
data-ratio="3/2"
data-max-width="100%"
data-allow-full-screen="true"
data-fit="cover">
Fotorama understands like an options object:
{
width: 500,
ratio: '3/2',
maxWidth: '100%',
allowFullScreen: true,
fit: 'cover'
}
The treatment of data-* attributes with embedded dashes conforms the W3C HTML5 specification.
Set options in one place for several fotoramas, initializing them in a jQuery manner:
$(function () {
// document is ready
$('.gallery').fotorama({
width: 500,
ratio: 3/2,
maxWidth: '100%',
allowFullScreen: true,
fit: 'cover'
});
});
Use any IDs or classes except the reserved .fotorama
for individual or mass initialization. You’ll be able to override some of the options with attributes:
<div class="gallery" data-width="333" data-ratio="2/3">
<a href="image.jpg"><img src="thumb.jpg"></a>
</div>
<div class="gallery" data-fit="contain" data-allow-full-screen="false">
<a href="image.jpg"><img src="thumb.jpg"></a>
</div>
from fotorama.
Thank you so much, i can't wait to try some things out!
from fotorama.
Related Issues (20)
- Внедрение fotorama в wordpress
- Caption always inside image (left) HOT 1
- Wrong direction logic for 'data-click="true"' with 'data-direction="rtl"'
- How open fullscreen when clicking on a large active picture?
- Is it possible to alter the iframe tag for Videos
- How to set fullscreen zoom size?
- Vimeo Video Not Working/Stopped Loading HOT 5
- Exit full screen mode throws js error
- Youtube thumbnail preview quality
- hidden thumbnails at small devices
- All Icons Are Same HOT 1
- Custom Thumbnails?
- Multiple galleries on one page — arrow key doesn't work on second one?
- fotorama.io not loading HOT 1
- Set amount of images diferent on default and on fullscreen
- Маленький формат галереи при первой загрузке странице
- How to force play and not download the video
- Different thumbnail size according to screen resolution
- Navigation arrows when video is loaded? HOT 1
- Is this lib reached end-of-life cycle HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fotorama.