Package Exports
- translucent
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (translucent) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Translucent
Transparent card theme - jQuery plugin.
Demo : https://byeolbit.github.io/translucent
Translucent is a jQuery plugin for make transparent/translucent design element in webpage.
What you need to use Translucent
- jQuery
- jQuery-UI
- Browser support
####Tested browsers
| Firefox 35.0 | Chrome 53.0 | Safari 6 | Edge 38.0 | Opera 40.0 |
|---|---|---|---|---|
 |
 |
 |
 |
 |
- Not support Internet Explorer. (It does not support CSS filter)
How to use translucent
1. Get plugin
2. Insert script into your HTML
<script src="jquery.ui.translucent.min.js"></script>※ Don't forget to insert jQuery and jQuery-UI in your page.
3. Make your background element and card element in HTML
<div class="your-background">
<div class="your-card">
<div class="tl-card-bg-container">
<div class="tl-card-bg"></div>
</div>
<div class="tl-card">
<div class="tl-card-contents">
<!-- your card contents here -->
</div>
<div>
</div>
</div>4. Apply translucent to your card element in script
$('.your-card').translucent('.your-background');or you can customize options.
$('.your-card').translucent('.your-background',{
filterValue : 5, // int
cardColor : 'clear', // preset color or your own color
draggable : true, // true or false
shadow : true // true or false
});