473,320 Members | 2,027 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

how to use SLIDER in an HTML page

19
hello every one,
Chk out the following link
go through the entire page

http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm

if u have gone through the link and tested it

Now can any body can tell me how to insert images in to the slider box so that they slide
i had tried my level best but cant be able to know So please guys help

ITS urgent reply me as early as possible
Jan 24 '07 #1
3 6394
acoder
16,027 Expert Mod 8TB
Do you want the auto slide or the manual slide?

A simple view source for the page shows:
[HTML]<div id="slider1" class="contentslide c1">

<div class="contentdiv">
<div><a href="http://www.dynamicdrive.com/style/csslibrary/item/suckertree-menu-horizontal/">SuckerTree Menu (h)</a></div>

<img src="http://www.dynamicdrive.com/cssexamples/suckertree2.gif" border="1" style="float: right; margin: 0 0 1px 5px" />
SuckerTree Horizontal Menu is a CSS and DOM hybrid menu that's list based and supports multiple levels of sub menus.
</div>

<div class="contentdiv">
<div><a href="http://www.dynamicdrive.com/style/csslibrary/item/half-moon-tab-menu/">Half moon tab menu</a></div>
<img src="http://www.dynamicdrive.com/cssexamples/halfmoon.gif" style="float: right; margin-left: 5px" border="1" />
We named this CSS tab menu "Half Moon" based on its look. The menu uses a transparent background image for each tab item to create a right round edge.
</div>

<div class="contentdiv">
<div><a href="http://www.dynamicdrive.com/style/csslibrary/item/slanted-divider-menu/">Slanted Divider Menu</a></div>
<img src="http://www.dynamicdrive.com/cssexamples/slantedmenu.gif" style="float: right; margin-left: 5px" border="1" />
This is an elegant CSS menu bar that uses a transparent "slanted" image to act as a divider and separate each menu item.
</div>

</div>

<div class="pagination p1" id="paginate-slider1"></div>

<script type="text/javascript">
ContentSlider("slider1", 3000)

</script>
[/HTML] for the auto slide and:
[HTML]<div id="slider2" class="contentslide c2">

<div class="contentdiv" style="background: url(../dynamicindex4/lightbox2/horses.jpg) center left no-repeat">
</div>

<div class="contentdiv" style="background: url(../dynamicindex4/lightbox/pine.jpg) center left no-repeat">
</div>

<div class="contentdiv" style="background: url(../dynamicindex4/lightbox/ocean.jpg) center left no-repeat">
</div>

<div class="contentdiv" style="background: url(../dynamicindex4/lightbox2/sushi2.jpg) center left no-repeat">
</div>

</div>

<div class="pagination p2" id="paginate-slider2"></div>

<script type="text/javascript">
ContentSlider("slider2")
</script>[/HTML] for the manual slide.

Adapt to your needs. Notice in particular, e.g
Expand|Select|Wrap|Line Numbers
  1. style="background: url(../dynamicindex4/lightbox/ocean.jpg) center left no-repeat"
for the manual slide. Replace the url with the url to your image.
Jan 25 '07 #2
bhanu08
19
Respeced sir,
Thanx for ur quick reply
i still ahave a small doubt
if i want to insert an image into the slide which is located in my hard disk
for example "C:\pics\main.jpg" then what changes i have to make in the following code

Expand|Select|Wrap|Line Numbers
  1. style="background: url(../dynamicindex4/lightbox/ocean.jpg) center left no-repeat"
please give me the correct changes to made in the above code asuming the path to be "C:\pics\main.jpg".

Wating for the Quickest reply

Regards
Bhanu
Jan 26 '07 #3
acoder
16,027 Expert Mod 8TB
Why not copy the main.jpg image into the folder containing your html file, or in an images folder in the same folder?
Jan 26 '07 #4

Sign in to post your reply or Sign up for a free account.

Similar topics

1
by: ACaunter | last post by:
Hi there, I was wondering how i could have a slider control on my asp.net page. Is this possible for asp.net?? or do i have to use javascript?? can anyone provide any code or links on how i...
1
by: degroof | last post by:
http://degroof.home.mindspring.com/hb/colors.html Simple slider control made from two div tags. Slider can be vertical, horizontal or XY. Demo page is a color picker with two sets of color...
1
by: Israel | last post by:
The problem: I want to know, definitively when a slider loses focus after a user has started sliding and hasn't released the mouse yet. It appears that this is captured with the WM_ACTIVATEAPP...
3
by: weston | last post by:
I'm making a foray into trying to create custom vertical scrollbars and sliders, and thought I had a basic idea how to do it, but seem to be having some trouble with the implementation. My...
4
by: bill | last post by:
How can I create a slider control or visual scale control which fires a server-side event when a selection is made? I would appreciate any tips. Thanks Bill
0
by: Home Coder | last post by:
Below is a link to a web page that loads a Java applet (sorry in advance). In the applet, on the bottom there is a pink colored slider. I would like to use/buy an a web version of this slider. Do...
2
by: Karl | last post by:
I trying to use the slider control in A2000. I don't see a mouse up event and the Updated event doesn't seem to fire after moving the slider. I did get lost focus to work if I click on another...
6
by: cmgmyr | last post by:
Hello, I'm trying to figure out how to disable a slider through the onChange function. Here is what I have so far: new Control.Slider('handle','slider', { axis:'horizontal', sliderValue: 1,...
0
by: sanrek | last post by:
Hi Folks, Slider control is driving me nuts, below is the code from my test page's page load event, nothing great about code, I have a place holder control into which I am adding a table which...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.