Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Sep 2012
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Changing label's text with next and previous buttons

    Hi,

    I have a label that needs to change its text each time a 'next' or 'previous' button is clicked.

    Basically I want to use it as a caption for several images, any help?

  • #2
    Regular Coder Redcoder's Avatar
    Join Date
    May 2012
    Location
    /dev/null
    Posts
    332
    Thanks
    2
    Thanked 47 Times in 46 Posts
    Of course you need to attach a click event to the buttons which will change the <label> contents every time the button is clicked.

    You should provide the code you have already so that we can help you.

  • #3
    New Coder
    Join Date
    Sep 2012
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This is the code I currently have:

    Code:
    	<div id = "carousel1" style="width:960px; height:280px;background:none;overflow:scroll; margin-top: 20px">            
            
    	<!-- All images with class of "cloudcarousel" will be turned into carousel items -->
            <!-- You can place links around these images -->
            <a href="1.html" rel="lightbox"><img class="cloudcarousel" src="images/slider/01.jpg" alt=""/></a>
            <a href="2.html" rel="lightbox"><img class="cloudcarousel" src="images/slider/02.jpg" alt=""/></a>
            <a href="3.html" rel="lightbox"><img class="cloudcarousel" src="images/slider/03.jpg" alt=""/></a>
            <a href="4.html" rel="lightbox"><img class="cloudcarousel" src="images/slider/04.jpg" alt=""/></a>
            <a href="5.html" rel="lightbox"><img class="cloudcarousel" src="images/slider/05.jpg" alt=""/></a>
            <a href="6.html" rel="lightbox"><img class="cloudcarousel" src="images/slider/06.jpg" alt=""/></a>
            
            <input id="slider-left-but" type="button" value="" style="cursor:pointer"/>
            <input id="slider-right-but" type="button" value="" style="cursor:pointer"/>
    
            <label id="caption" style="float:left; margin:260px 0px 0px 350px;">Click The Image To Read More</label>
    
        	</div>

  • #4
    Regular Coder Redcoder's Avatar
    Join Date
    May 2012
    Location
    /dev/null
    Posts
    332
    Thanks
    2
    Thanked 47 Times in 46 Posts
    Well, that is HTML code. You need Javascript code to trigger events.

    Where is the Javascript code you are using to trigger events so that we can help you?

  • #5
    New Coder
    Join Date
    Sep 2012
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Can I not have a new script to do this?

  • #6
    Regular Coder Redcoder's Avatar
    Join Date
    May 2012
    Location
    /dev/null
    Posts
    332
    Thanks
    2
    Thanked 47 Times in 46 Posts
    You need to have at least something done so that we can guide you on what to do. So at least make a wireframe.

    But the lightbox seems like a JS script itself.

    If not, you can get somebody to do it for you at the Web Projects and Jobs forum section.

  • #7
    New Coder
    Join Date
    Sep 2012
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Oh ok, I haven't got a script yet and I got no idea how to start it.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •