•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 425,816 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 3,081 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 610 | Replies: 1
 |
•
•
Join Date: May 2008
Posts: 3
Reputation: 
Rep Power: 0
Solved Threads: 1
Newbie Poster
Hi all!
I found that is difficult to search a simple javascript code about scrolling image slide. You can find them on Internet but they often are long and complex or hidden from us to prevent edit.
I just found a simple way to resolve this. I hope it will help your editting easier to make it yours!
We need 2 div tag to make a slide. ChildDiv to store image array and ParentDiv to contain Child Div.
Note:
Image Array's Structure: [<Image's Link>, <Image's Width>, <URL to Go>]
Functions:
DoSlide(), Make Slide to run.
setmouse(param), set Slide play and pause when pointer over or out on images;
Dr_ImgArr(); Print image array to HTML;
getE(), getElementById();
DivWidth: Width of ParentDiv;
MoreImage: Num Of Image on a begin of Image Array, insert into the last of ChildDiv to continue the Slide;
....
If you have anymore comment, please reply here so that I can make it more perfect,
thank for all.
Demo: http://boy.us.com/Code/slide.php
Style
Javascript
HTML Body
I found that is difficult to search a simple javascript code about scrolling image slide. You can find them on Internet but they often are long and complex or hidden from us to prevent edit.
I just found a simple way to resolve this. I hope it will help your editting easier to make it yours!
We need 2 div tag to make a slide. ChildDiv to store image array and ParentDiv to contain Child Div.
Note:
Image Array's Structure: [<Image's Link>, <Image's Width>, <URL to Go>]
Functions:
DoSlide(), Make Slide to run.
setmouse(param), set Slide play and pause when pointer over or out on images;
Dr_ImgArr(); Print image array to HTML;
getE(), getElementById();
DivWidth: Width of ParentDiv;
MoreImage: Num Of Image on a begin of Image Array, insert into the last of ChildDiv to continue the Slide;
....
If you have anymore comment, please reply here so that I can make it more perfect,
thank for all.
Demo: http://boy.us.com/Code/slide.php
Style
<style>
#ParentDiv
{
margin: auto;
width: 600px;
overflow: hidden;
}
#ChildDiv
{
width: 6000px;
position:relative;
cursor:pointer;
}
#ParentDiv img
{
float: left;
padding: 3px;
margin: 0px;
}
</style>Javascript
Javascript Syntax (Toggle Plain Text)
HTML Body
HTML Syntax (Toggle Plain Text)
•
•
Join Date: Jun 2006
Location: India
Posts: 6,855
Reputation: 
Rep Power: 23
Solved Threads: 344
This code snippet would be more suited in the Code Snippets section where it can be used / referenced by the masses out there. Please reconsider posting it there.
A few comments:
•
• Using
• It would be better if the slider could be configured by passing parameters to the function call i.e.
• It would be even better if you could wrap the entire functionality inside a custom object which the user can instantiate. This object would have state and do away with the requirement of having globally scoped variables.
A few comments:
•
location is a property of the window object and not the document object.• Using
document.write() is not so graceful; disable javascript and watch your page fail miserably. A better and more appropriate way would be to use DOM manipulation.• It would be better if the slider could be configured by passing parameters to the function call i.e.
Dr_ImgArr(stepTime, padding)
• It would be even better if you could wrap the entire functionality inside a custom object which the user can instantiate. This object would have state and do away with the requirement of having globally scoped variables.
Last edited by ~s.o.s~ : May 18th, 2008 at 1:42 pm.
I don't accept change. I don't deserve to live.
Happiness corrupts people.
Failing to value the lives of others cheapens your own.
Happiness corrupts people.
Failing to value the lives of others cheapens your own.
|
•
•
•
•
•
•
•
•
DaniWeb JavaScript / DHTML / AJAX Marketplace
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
Linear Mode
•
•
•
•
access activation api blogger blogging blogs code code injection combo dani daniweb data debugging development dreamweaver dropdownlist epilepsy firefox gdata google gpl griefers hackers html image recognition image search innovation javascript key linux microsoft module net news openbsd product programming reuse rss search serial source tags video search vista web wysiwyg xml
- Previous Thread: Pull down menue using getElemntById --Help Please
- Next Thread: .src undefined error
