69 lines
2.1 KiB
JavaScript
69 lines
2.1 KiB
JavaScript
$(document).ready(function(){
|
|
if( $(".project-img").size() > 0 )
|
|
{
|
|
$(".container").append("<div class=\"image-overlay\"><img/><div class='text'></div></div>");
|
|
}
|
|
|
|
if( $(".project-audio").size() > 0 )
|
|
{
|
|
$(".container").append("<div class=\"audio-overlay\"><audio controls><source type=\"audio/mp3\">Your browser does not support the audio element.</audio><div class='text'></div></div>");
|
|
}
|
|
|
|
if( $(".project-vid").size() > 0 )
|
|
{
|
|
$(".container").append("<div class=\"video-overlay\"><video controls><source type=\"video/mp4\">Your browser does not support the video element.</video><div class='text'></div></div>");
|
|
}
|
|
});
|
|
|
|
$(".project-img").click(function(e){
|
|
var source = $(this).attr("src");
|
|
var name = $(this).attr("alt");
|
|
|
|
$(".image-overlay img").attr("src", source);
|
|
$(".image-overlay .text").html(name);
|
|
$(".image-overlay").fadeIn();
|
|
});
|
|
|
|
$(".container").on("click", ".image-overlay", function(e){
|
|
$(".image-overlay").fadeOut();
|
|
$(".image-overlay img").attr("src", "");
|
|
$(".image-overlay .text").html("");
|
|
});
|
|
|
|
$(".project-audio").click(function(e){
|
|
var source = $(this).data("src");
|
|
var name = $(this).attr("alt");
|
|
|
|
$(".audio-overlay audio source").attr("src", source);
|
|
$(".audio-overlay .text").html(name);
|
|
$(".audio-overlay").fadeIn();
|
|
|
|
$(".audio-overlay audio").trigger("load");
|
|
});
|
|
|
|
$(".container").on("click", ".audio-overlay", function(e){
|
|
$(".audio-overlay").fadeOut();
|
|
//$(".audio-overlay audio source").attr("src", "");
|
|
$(".audio-overlay .text").html("");
|
|
|
|
$(".audio-overlay audio").trigger("pause");
|
|
});
|
|
|
|
$(".project-vid").click(function(e){
|
|
var source = $(this).data("src");
|
|
var name = $(this).attr("alt");
|
|
|
|
$(".video-overlay video source").attr("src", source);
|
|
$(".video-overlay .text").html(name);
|
|
$(".video-overlay").fadeIn();
|
|
|
|
$(".video-overlay video").trigger("load");
|
|
});
|
|
|
|
$(".container").on("click", ".video-overlay", function(e){
|
|
$(".video-overlay").fadeOut();
|
|
//$(".video-overlay video source").attr("src", "");
|
|
$(".video-overlay .text").html("");
|
|
|
|
$(".video-overlay video").trigger("pause");
|
|
}); |