What are the steps to integrate it?
- Copy the slider.js onto your web server or upload it into Shared Components\Static Files
- Upload the images you want to use for the slider onto your web server or into Shared Components\Images. In my case it’s sldr5h_bg.gif and sldr5h_sl.gif
- Add the following code into Edit Page Attributes\HTML Header
Note: Replace #APP_IMAGES# if you didn’t upload the files to the Shared components. If you didn’t assign the files to the application, use #WORKSPACE_IMAGES# instead.
- Create a text item on your page. For example named P1_VALUE
- Set the HTML Form Element Attributes property to
- Set the Pre Element Text property to
- Add the following code
into the Post Element Text property and replace the red marked code parts. See the documentation for the different settings.
That’s it, you are already done! It’s now time to run your page to try it out.
See my example slider application for a working example.
Update on 26-Jan-2008: I have changed the original example to use just one field. That’s better, because in the original example which used a second field with the Begin On New Line set to No, it could result in a detached slider if there are other fields which also use Begin On New Line=No. I’m now wrapping a table around both elements (text field and slider) to tight them together.