AGREGAR SEGUNDO SLIDE DE IMAGENES
Publicado por Pablo (24 intervenciones) el 18/10/2016 15:50:35
Amigos.
Una vez más los molesto con mis preguntas. Agregué un slide show al webform, y me funciona fantástico. Ahora necesito agregar otro justo al lado del primero, con otras imágenes. La cosa es que al ejecutar, me tira todas las imágenes al primer slide.
Esto requiero: Primer slide: mostrar imágenes 1,2 y 3.
Segundo Slide: mostrar imágenes 4, 5 y 6
Por favor denme una mano... Este es el código del primer slide (lo copié de Internet). Recuerden que no soy programador.
Una vez más los molesto con mis preguntas. Agregué un slide show al webform, y me funciona fantástico. Ahora necesito agregar otro justo al lado del primero, con otras imágenes. La cosa es que al ejecutar, me tira todas las imágenes al primer slide.
Esto requiero: Primer slide: mostrar imágenes 1,2 y 3.
Segundo Slide: mostrar imágenes 4, 5 y 6
Por favor denme una mano... Este es el código del primer slide (lo copié de Internet). Recuerden que no soy programador.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Simple Slideshow Example in Asp.net</title>
<script src="http://code.jquery.com/jquery-1.8.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
var currentPosition = 0;var slideWidth = 500;var slides = $('.slide');
var numberOfSlides = slides.length;
setInterval(changePosition, 3000);
slides.wrapAll('<div id="slidesHolder"></div>');
slides.css({ 'float': 'left' });
$('#slidesHolder').css('width', slideWidth * numberOfSlides);
function changePosition() {
if (currentPosition == numberOfSlides - 1) {
currentPosition = 0;}else {currentPosition++;
}moveSlide();
}function moveSlide() {
$('#slidesHolder').animate({ 'marginLeft': slideWidth * (-currentPosition) });
}});
</script>
<style type="text/css">
#slideshow #slideshowWindow
{width:500px;height:257px;margin:0;padding:0;position:relative;overflow:hidden;}#slideshow #slideshowWindow .slide
{margin:0;padding:0;width:500px;height:257px;float:left;position:relative;}</style>
</head>
<body>
<div id="slideshow">
<div id="slideshowWindow">
<div class="slide"><b>Welcome to Aspdotnet-Suresh.com SlideShow Image1</b> <img src="https://lh5.googleusercontent.com/-YRAs5XWsj3k/UROnzTJcTrI/AAAAAAAAD98/UIRWUOOwbsY/s450/SaveWater.jpg" /> </div>
<div class="slide"><b>Welcome to Aspdotnet-Suresh.com SlideShow Image2</b><img src="https://lh3.googleusercontent.com/-CWFgJqYK0lo/UROnzXcKNiI/AAAAAAAAD94/H3zWwqQ03xk/s300/Hopetoun_falls2.jpg" /> </div>
<div class="slide"><b>Aspdotnet-Suresh.com SlideShow Image3</b><img src="https://lh3.googleusercontent.com/-_tRUTe8jkiY/UROnzYKamnI/AAAAAAAAD-A/PBWOsc1ZrXg/s300/slideshowImage.jpg" /> </div>
</div>
</div>
</body>
</html>
Valora esta pregunta
0