Difference between revisions of "Template:KU Leuven/research/idea/css"

Line 192: Line 192:
 
}
 
}
  
−
.enhance{
+
.image-row{text-align:center}
−
    display: none;
+
@media (min-width:640px){.image-row{text-align:left}}
−
    position:absolute;
+
.example-image-link{display:inline-block;padding:2px;margin:0 .5rem 1rem .5rem;line-height:0;border-radius:4px;transition:background-color .5s ease-out}
−
    width:100%;
+
.example-image-link:hover{background-color:#4ae;transition:none}
−
    height:100%;
+
.example-image{width:7rem;border-radius:4px}
−
    background-color: white;
+
−
}
+
−
.img{
+
−
    position:absolute;
+
−
    width:20%;
+
−
    align:center;
+
−
  }
+
−
 
+
−
$(document).ready(function() {
+
−
 
+
−
/* This is basic - uses default settings */
+
−
+
−
$("a#single_image").fancybox();
+
−
+
−
/* Using custom settings */
+
−
+
−
$("a#inline").fancybox({
+
−
'hideOnContentClick': true
+
−
});
+
−
 
+
−
/* Apply fancybox to multiple items */
+
−
+
−
$("a.group").fancybox({
+
−
'transitionIn' : 'elastic',
+
−
'transitionOut' : 'elastic',
+
−
'speedIn' : 600,
+
−
'speedOut' : 200,
+
−
'overlayShow' : false
+
−
});
+
−
+
−
});
+
−
 
+
−
.image-row{text-align:center}@media (min-width:640px){.image-row{text-align:left}}.example-image-link{display:inline-block;padding:2px;margin:0 .5rem 1rem .5rem;background-color:#fff;line-height:0;border-radius:4px;transition:background-color .5s ease-out}.example-image-link:hover{background-color:#4ae;transition:none}.example-image{width:7rem;border-radius:4px}
+
  
 
</style>
 
</style>
  
 
</html>
 
</html>

Revision as of 19:45, 12 August 2015