PDA

View Full Version : Slideshow with ASP and JS - Ultimate Fade-in slideshow (v2.4)



freya-san
06-10-2011, 02:26 PM
1) Script Title: Ultimate Fade-in slideshow (v2.4)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm (and http://www.dynamicdrive.com/forums/showthread.php?t=29378)

3) Describe problem:

Hi all

I am trying to get a slideshow to work on my website that pulls the images from a folder on the server rather than pre-populated within the code. I managed to find the post (http://www.dynamicdrive.com/forums/showthread.php?t=29378) which looks at the script title above, but after playing for a couple of hours can only get the script to produce a listing of all the file name URLs.

I can't seem to get the ASP code to feed the slideshow. I have put my code below, and I would appreciate any and all help that you can give.

Thanks

Freya



<html>
<head>
</head>
<body>

<%
' The Runtime code:
' Create some asp variables for
Dim strPath 'Path of directory
Dim objFSO 'FileSystemObject variable
Dim objFolder 'Folder variable
Dim objItem 'Variable used to loop through the contents of the folder

' You could just as easily read this from some sort of input
' NOTE: As currently implemented, this needs to end with the /
strPath = "/images/english/"

' Create our FSO
Set objFSO = Server.CreateObject("Scripting.FileSystemObject")

' Get a handle on our folder
Set objFolder = objFSO.GetFolder(Server.MapPath(strPath))

'Create some javascript variables
%>

<script>
var counter=0
var fadeimages=new Array()
</script>

<%

'Selecting only images
Set RegExObj = New RegExp
With RegExObj
.Pattern = "gif|jpg|png"
.IgnoreCase = True
End With
For Each objItem In objFolder.Files
If RegExObj.Test(Right(objItem.Name, 3)) Then
'Add each one to the array using javascript
%>

<script>
fadeimages[counter]=["/images/english/<%= objItem.Name %>", "", ""]
counter++
</script>

<%
End If
Next 'objItem

' All done! Kill off our asp object variables.
Set objItem = Nothing
Set objFolder = Nothing
Set objFSO = Nothing
Set RegExObj = Nothing
%>


</body>
</html>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>



<script type="text/javascript" src="fadeslideshow.js">



/***********************************************
*
Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more

***********************************************

/

</script>



<script type="text/javascript">



var mygallery=new fadeSlideShow({

wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow

dimensions: [180, 100], //width/height of gallery in pixels. Should reflect dimensions of largest image

imagearray: [],

displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},

persist: false, //remember last viewed slide and recall within same session?

fadeduration: 500, //transition duration (milliseconds)

descreveal: "ondemand",

togglerid: ""
})



</script>

<div id="fadeshow1">
</div>

freya-san
06-10-2011, 02:48 PM
Hi all,

I managed to get it to work with the following code:



<html>
<head>
</head>
<body>

<%
' The Runtime code:
' Create some asp variables for
Dim strPath 'Path of directory
Dim objFSO 'FileSystemObject variable
Dim objFolder 'Folder variable
Dim objItem 'Variable used to loop through the contents of the folder

' You could just as easily read this from some sort of input
' NOTE: As currently implemented, this needs to end with the /
strPath = "/sorce/images/english/"

' Create our FSO
Set objFSO = Server.CreateObject("Scripting.FileSystemObject")

' Get a handle on our folder
Set objFolder = objFSO.GetFolder(Server.MapPath(strPath))

'Create some javascript variables
%>

<script>
var counter=0
var fadeimages=new Array()
</script>

<%

'Selecting only images
Set RegExObj = New RegExp
With RegExObj
.Pattern = "gif|jpg|png"
.IgnoreCase = True
End With
For Each objItem In objFolder.Files
If RegExObj.Test(Right(objItem.Name, 3)) Then
'Add each one to the array using javascript
%>

<script>
fadeimages[counter]=["/sorce/images/english/<%= objItem.Name %>", "", ""]
counter++
</script>

<%
End If
Next 'objItem

' All done! Kill off our asp object variables.
Set objItem = Nothing
Set objFolder = Nothing
Set objFSO = Nothing
Set RegExObj = Nothing
%>


</body>
</html>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>



<script type="text/javascript" src="fadeslideshow.js">



/***********************************************
*
Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more

***********************************************

/

</script>



<script type="text/javascript">



var mygallery=new fadeSlideShow({

wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow

dimensions: [250, 150], //width/height of gallery in pixels. Should reflect dimensions of largest image

imagearray: fadeimages,

displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},

persist: false, //remember last viewed slide and recall within same session?

fadeduration: 500, //transition duration (milliseconds)

descreveal: "ondemand",

togglerid: ""
})



</script>

<div id="fadeshow1">
</div>

Just putting it up in case it helps someone else!

jscheuer1
06-10-2011, 07:34 PM
A fairly easy to use and often overlooked tool in developing asp code like this is the browser's native 'view source' menu item. When used while viewing the page it will show you how the asp code is being interpreted by the server and presented to the browser.

For a similar but different implementation see:

http://www.dynamicdrive.com/forums/showthread.php?p=40466#post40466