Buenas,
Estoy probando una web que tiene una precarga con javascrpit al iniciar, tambien en esa misma web uso script para que al agrandar y achicar la ventana del navegador la imagen haga un efecto "resize". El problema es que los dos scripts juntos no funcionan, pero separados si. Mi pregunta es, como puedo hacer para que funcionen los dos scripts juntos?. Estuve investigando pero no encontre una solucion que me ayudara.
Aqui les dejo el codigo html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Documento sin título</title>
<script type="text/javascript" src="javascripts/prototype.js"></script>
<script type='text/javascript' src='javascripts/jquery.min.js'></script>
<link rel="stylesheet" href="css/queryLoader.css" type="text/css" />
<script type='text/javascript' src='javascripts/queryLoader.js'></script>
<link href="css/bgimage.css" rel="stylesheet" type="text/css" />
<link href="javascripts/application.js" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="coal_homepage_slideshow" class="coal_slideshow">
<img alt="Studio" id="coal_slideshow_0" src="img/studio/1.jpg" /></div>
<script type="text/javascript" src="javascripts/application.js"></script>
<script type="text/javascript"> Layout = {
// setup
ih: 0,
iw: 0,
iar: 1,
war: 1,
img: '',
GetWindowSize: function(w) {
w = w ? w : window;
var width = w.innerWidth || (w.document.documentElement.clientWidth || w.document.body.clientWidth);
var height = w.innerHeight || (w.document.documentElement.clientHeight || w.document.body.clientHeight);
return [width, height];
},
// initialize
init: function(e) {
// image height, width and aspect ratio
Layout.img = $('coal_slideshow_0');
Layout.holder = $('coal_homepage_slideshow');
Layout.ih = Layout.img.getHeight();
Layout.iw = Layout.img.getWidth();
Layout.iar = Layout.iw / Layout.ih;
Layout.resize(e);
Layout.number_of_images = images_json.length;
},
resize: function(e) {
// window width, height and aspect ratio
ws = Layout.GetWindowSize(window);
window_width = ws[0];
window_height = ws[1];
window_ratio = window_width / window_height;
image_width = Layout.iw;
image_height = Layout.ih;
image_ratio = Layout.iar;
new_image_width = window_width;
new_image_height = ( new_image_width / image_width ) * image_height;
width_diff = 0;
height_diff = -( new_image_height - window_height ) / 2;
if( new_image_height < window_height ) {
new_image_height = window_height;
new_image_width = ( new_image_height / image_height ) * image_width;
height_diff = 0;
width_diff = -( new_image_width - window_width ) / 2;
}
niw = Math.ceil(new_image_width);
nih = Math.ceil(new_image_height);
slideshow_images = Layout.holder.select('img');
slideshow_images.each( function(simage, index) {
simage.setStyle( { width: niw+"px", height: nih+"px", top: height_diff+'px', left: width_diff+'px' } );
});
}
}
images_json = ["img/studio/1.jpg"];
Event.observe(window, 'resize', function() { Layout.resize(); } );
Event.observe(window, 'load', function() {
// images, container class_name, transition_time, interval
slideshow = new EKSlideShow( images_json, 'coal_slideshow', 1, 7 );
pe = new PeriodicalExecuter(function(pe) {
Layout.init();
pe.stop();
pee = new PeriodicalExecuter( function(pee) {
Layout.resize();
}, 3);
}, 0.02);
});// JavaScript Document
</script>
<script type='text/javascript'>
QueryLoader.init();
</script>
</body>
</html>
saludos y gracias de antemano