リキッドな横幅に比率を維持して高さを可変させるスクリプト

リキッドな横幅に比率を維持して高さを可変させるスクリプト

01	$(function(){

02	// トップスライド

03	var WIDTH = 1570;

04	var HEIGHT = 655;

05	var ratio = HEIGHT / WIDTH;

06

07	var $ts = $('#top_slide');

08	var $ct = $('.slides');

09

10	var onResize = function () {

11	var windowWidth = document.documentElement.clientWidth;

12	var imageWidth = windowWidth;

13	var imageHeight = windowWidth * ratio;

14

$ct.css({

15	width: imageWidth,

16	height: imageHeight

17

});

18

};

19

20	$ts.psycle({

21	transition: 'fade',

22	cancel: false,

23	delay: 4000

24

});

25	$ts.marker($('#top_slide .pager'), 300);

26

27	onResize();

28

29	$(window).on('resize', onResize);

30

31

});