Scribd
Upload
32 views2 pages

".Thumbs A" "Href" ".Boat - Listing .Maingallery" 400 ".Boat - Listing .Maingallery" 'SRC'

This document contains JavaScript code for image gallery functionality including fading images in and out on click, setting image sources, and calculating padding. It also contains code for animating elements using the TweenLite library, including tweening element properties like position, size, color, and opacity over durations with easing. Functions are used to restart tweens on button click.

Uploaded by

Abhishek Mishra
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
32 views2 pages

".Thumbs A" "Href" ".Boat - Listing .Maingallery" 400 ".Boat - Listing .Maingallery" 'SRC'

This document contains JavaScript code for image gallery functionality including fading images in and out on click, setting image sources, and calculating padding. It also contains code for animating elements using the TweenLite library, including tweening element properties like position, size, color, and opacity over durations with easing. Functions are used to restart tweens on button click.

Uploaded by

Abhishek Mishra
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2

$(".thumbs a").

click(function(e) {
e.preventDefault();
$imgURL = $(this).attr("href");
$(".boat_listing .mainGallery").fadeIn(400, function() {
$(".boat_listing .mainGallery").attr('src',$imgURL);
});
});

$(document).ready(function(){

// calculate height
var screen_ht = $(window).height();
var preloader_ht = 5;
var padding =(screen_ht/2)-preloader_ht;

$("#preloader").css("padding-top",padding+"px");

})

<script type="text/javascript"> rotate = 1; function hide_preloader() { // To stop the preloader rotate = 0;


// To apply Fade Out Effect to the Preloader $("#preloader").fadeOut(1000); } </script>

$(".thumbs a").click(function(e) {
e.preventDefault();
$imgURL = $(this).attr("href");
$(".boat_listing .mainGallery")
.fadeOut(400, function() {
$(".boat_listing .mainGallery").attr('src',$imgURL);
})
.fadeIn(400);
});

$("#link").click(function() {
$("#image").fadeTo(1000,0.30, function() {
$("#image").attr("src",$("#link").attr("href"));
}).fadeTo(500,1);
return false;
});

TweenLite.to( [target object], [duration in seconds], [destination values] )

TweenLite.to(logo,3, {left:"440px", ease:Power2.easeOut});


TweenLite.to(logo, 2, {left:"632px", delay:2});

TweenLite.to(logo, 2, {left:"542px",
backgroundColor:"black",
borderBottomColor:"#90e500",
color:"white"});

TweenLite.from(logo, 2, {opacity:0, left:"300px"});


TweenLite.to(logo, 0.5, {left:"+=100px"});

var red = document.getElementById("red");


var yellow = document.getElementById("yellow");
var green = document.getElementById("green");
TweenLite.to([red, yellow, green], 1, {scale:0.2, opacity:0.3});
var tween = TweenLite.to(logo, 1, {left:"632px"});
restartButton.onclick = function(){
//call the tween's restart() method
tween.restart();
}

You might also like