Ayuda con una secuencia de imagenes
2 seguidores
Hola,
no se si alguien me podría ayudar....
he comprado por internet un slider de imagenes, creia que me seria más facil de modificarlo..... pero claro poca idea tengo...
Quiero hacer una secuencia de imágenes con vocabulario en ingles, me gustaria introducir sonido, cuando salga la imagen del texto (una voz que nombrara la palabra). Que el sonido estuviera por defecto pero que hubiera la opción de silenciarlo.
Que entre imagen e imagen no se vea el relojito ese de cargar la imagen, ni la imagen gris.
También necesito que en la ultima imagen se detenga la secuencia ya que se repite indefinidamente
si fuera necesario copio el codigo html para que le echeis un vistazo,
muchas gracias de antemano
saludillos
garciasanchezdani
Buenas @luapatapunk no has añadido el enlace correctamente, ya que no se ve.
Para hacer todos los cambios que pides, quizás no puedan hacerse mediante los ajustes del slider. De ser así, vas a necesitar la ayuda de un programador que entienda el código para poder modificarlo a tu gusto.
Saludos :)
luapatapunk
uy es verdad, no esta el enlace...jeje
es este:
http://educadivierte.com/bits/colors.html
los cambios se tienen que hacer en el codigo, lo que no se es si aguien me puede ayudar facilmente, si no es muy complicado o como dices tu, me busco mejor la vida llamando a un programador.....
Añado tambien el codigo.
gracias, un saludo
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Revolution Multimedia Gallery</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1 user-scalable=no" />
<!-- Import required css and js files -->
<link rel="stylesheet" type="text/css" href="content/global.css"/>
<script type="text/javascript" src="java/FWDRMG.js"></script>
<!-- Setup RMG -->
<script type="text/javascript">
FWDRMGUtils.onReady(function(){
new FWDRMG({
//main settings
instanceName:"myRMG",
displayType:"fullscreen",
parentId:"myDiv",
mainFolderPath:"content",
skinPath:"minimal_skin",
playlistId:"myPlaylist",
facebookAppId:"213684265480896",//required only if the facebook share button is used
rightClickContextMenu:"developer",
buttonsAlignment:"out",
allCategoriesLabel:"+ All categories (mixed)",
useDeepLinking:"yes",
autoScale:"yes",
showAllCategories:"yes",
randomizeAllCategories:"yes",
randomizeCategories:"no",
slideShowAutoPlay:"yes",
addKeyboardSupport:"yes",
showFullScreenButton:"yes",
showFacebookButton:"no",
showZoomButton:"no",
showSlideShowButton:"yes",
showSlideShowAnimation:"no",
showNextAndPrevButtons:"yes",
showNextAndPrevButtonsOnMobile:"yes",
maxWidth:940,
maxHeight:600,
startAtCategory:1,
startAtItem:2,
buttonsHideDelay:3,
slideShowDelay:3,
defaultItemWidth:640,
defaultItemHeight:480,
itemOffsetHeight:40,
spaceBetweenButtons:2,
buttonsOffsetIn:4,
buttonsOffsetOut:4,
itemBorderSize:4,
itemBorderRadius:0,
itemBoxShadow:"none",
itemBackgroundColor:"#333333",
itemBorderColor:"#FFFFFF",
backgroundColor:"#000000",
//thumbnails settings
showThumbnails:"no",
showThumbnailsHideOrShowButton:"yes",
showThumbnailsByDefault:"yes",
showThumbnailsOverlay:"yes",
showThumbnailsSmallIcon:"yes",
thumbnailsHoverEffect:"scale",
thumbnailsImageHeight:80,
thumbnailsBorderSize:4,
thumbnailsBorderRadius:0,
spaceBetweenThumbnailsAndItem:0,
thumbnailsOffsetBottom:0,
spaceBetweenThumbnails:2,
thumbnailsOverlayOpacity:.8,
thumbnailsOverlayColor:"#FFFFFF",
thumbnailsBorderNormalColor:"#FFFFFF",
thumbnailsBorderSelectedColor:"#FFFFFF",
//description settings
descriptionWindowPosition:"bottom",
showDescriptionButton:"no",
showDescriptionByDefault:"no",
descriptionWindowAnimationType:"opacity",
descriptionWindowBackgroundColor:"#FFFFFF",
descriptionWindowBackgroundOpacity:.9,
//categories menu settings
showCategoriesMenuButton:"no",
buttonBackgroundNormalColor:"#c2c2c2",
buttonBackgroundSelectedColor:"#000000",
buttonTextNormalColor:"#FFFFFF",
buttonTextSelectedColor:"#FFFFFF",
buttonBackgroundOpacity:.9,
//video & audio players settings
useVideo:"yes",
useAudio:"yes",
videoShowFullScreenButton:"yes",
addVideoKeyboardSupport:"yes",
nextVideoOrAudioAutoPlay:"yes",
videoAutoPlay:"no",
videoLoop:"no",
audioAutoPlay:"no",
audioLoop:"no",
videoControllerHideDelay:3,
videoControllerHeight:41,
audioControllerHeight:44,
startSpaceBetweenButtons:7,
vdSpaceBetweenButtons:9,
mainScrubberOffestTop:14,
scrubbersOffsetWidth:1,
audioScrubbersOffestTotalWidth:4,
timeOffsetLeftWidth:5,
timeOffsetRightWidth:3,
volumeScrubberWidth:80,
volumeScrubberOffsetRightWidth:0,
videoControllerBackgroundColor:"#FFFFFF",
videoPosterBackgroundColor:"#0099FF",
audioControllerBackgroundColor:"#FFFFFF",
timeColor:"#000000"
});
});
</script>
</head>
<body style="background-color:#555555;">
<div id="myDiv" style="margin:auto;"></div>
<!-- Playlist -->
<div id="myPlaylist" style="display:none">
<ul data-category-name="+ Category 1 (image gallery)">
<li data-url="content/media/images/1.jpg" data-thumbnail-path="content/media/thumbnails/1.jpg">
<p>Item description here, this content can be stylised with css, if you don't need it remove the this paragraph.</p>
</li>
<li data-url="content/media/images/2.jpg" data-thumbnail-path="content/media/thumbnails/2.jpg">
<p>Item description here, this content can be stylised with css, if you don't need it remove the this paragraph.</p>
</li>
<li data-url="content/media/images/3.jpg" data-thumbnail-path="content/media/thumbnails/3.jpg">
<p>Item description here, this content can be stylised with css, if you don't need it remove the this paragraph.</p>
</li>
<li data-url="content/media/images/4.jpg" data-thumbnail-path="content/media/thumbnails/4.jpg">
<p>Item description here, this content can be stylised with css, if you don't need it remove the this paragraph.</p>
</li>
<li data-url="content/media/images/5.jpg" data-thumbnail-path="content/media/thumbnails/5.jpg">
<p>Item description here, this content can be stylised with css, if you don't need it remove the this paragraph.</p>
</li>
<li data-url="content/media/images/6.jpg" data-thumbnail-path="content/media/thumbnails/2.jpg">
<p>Item description here, this content can be stylised with css, if you don't need it remove the this paragraph.</p>
</li>
<li data-url="content/media/images/7.jpg" data-thumbnail-path="content/media/thumbnails/2.jpg">
<p>Item description here, this content can be stylised with css, if you don't need it remove the this paragraph.</p>
</li>
<li data-url="content/media/images/8.jpg" data-thumbnail-path="content/media/thumbnails/2.jpg">
<p>Item description here, this content can be stylised with css, if you don't need it remove the this paragraph.</p>
</li>
</ul>
<ul data-category-name="+ Category 2 (multimedia gallery)">
<li data-url="content/media/images/1.jpg" data-thumbnail-path="content/media/thumbnails/image.jpg">
<p>Item description here!</p>
</li>
<li data-url="content/media/videos/desktop.mp4,content/media/videos/mobile.mp4" data-poster-path="content/media/posters/video.jpg,content/media/posters/video-mobile.jpg" data-thumbnail-path="content/media/thumbnails/video2.jpg" data-width="600" data-height="450">
<p>Item description here!</p>
</li>
<li data-url="content/media/audio/audio1.mp3" data-thumbnail-path="content/media/thumbnails/audio1.jpg" data-width="400">
<p>Item description here!</p>
</li>
<li data-url="https://www.youtube.com/watch?v=9bZkp7q19f0" data-thumbnail-path="content/media/thumbnails/youtube.jpg" data-width="1000" data-height="550">
<p>Item description here!</p>
</li>
<li data-url="http://vimeo.com/50747914" data-thumbnail-path="content/media/thumbnails/vimeo.jpg" data-width="900" data-height="550">
<p>Item description here!</p>
</li>
<li data-url="content/media/flash/fwd.swf" data-thumbnail-path="content/media/thumbnails/flash.jpg" data-width="600" data-height="450">
<p>Item description here!</p>
</li>
<li data-url="https://www.google.com/maps/embed/v1/place?q=castelul%20hunedoara&key=..." data-thumbnail-path="content/media/thumbnails/maps.jpg" data-width="1100", data-height="650">
<p>Item description here!</p>
</li>
<li data-url="RMG_HTML" data-thumbnail-path="content/media/thumbnails/html.jpg" data-width="346" data-height="350">
<p class="white">HTML content here.</p>
</li>
<li data-url="RMG_AJAX:content/ajax.html" data-thumbnail-path="content/media/thumbnails/ajax.jpg" data-width="900" data-height="650"></li>
<li data-url="http://www.webdesign-flash.ro/iframe.html" data-thumbnail-path="content/media/thumbnails/iframe.jpg" data-width="900" data-height="650">
<p>Item description here!</p>
</li>
</ul>
</div>
</body>
</html>