Lightbox Gallery, moving prev/next buttons to outside of the gallery box

Hello,
I want to change the look of the "prev" and "next" buttons to simple arrows and move them outside of the big image that opens up when you click on the thumbnail, so that no part of the big image is covered by these buttons.  Creating the arrow images are easy, but I've still got a lot to learn when it come to dealing with scripts.
Which part of the script do I need to change to move the location of where there buttons show up?

Julie726 wrote:
Actually, I'm still having a problem getting those buttons to display before I worry about moving their positions.
They have been uploaded to the correct locations.  I can't figure out why they don't display.
They don't display because the link to those buttons points to an "images" folder (lowercase I) but they're stored on the server in "Images" folder (capital I).
http://www.julieappelt.com/images/lightbox/lightbox-btn-close.gif does not work
http://www.julieappelt.com/Images/lightbox/lightbox-btn-close.gif works
It's usually best to avoid mixing cases when naming folders and files to avoid these issues, esp on Linux servers. Stick to all lowercase.

Similar Messages

  • Prev/Next Buttons

    I am using some paging code to add a previous and next
    buttons to my spry gallery. I am attempting (unsuccessfully) to
    hide the previous button at the beginning of the recordset and the
    next button at the end. I have pasted the code below if anyone has
    any ideas.
    <script language="JavaScript" type="text/javascript">
    <!--
    var pageOffset =0;
    var pageSize = 5;
    var pageStop = pageOffset + pageSize;
    var dsGallery = new Spry.Data.XMLDataSet("images.xml",
    "/gallery/photos/photo", { filterFunc: MyPagingFunc });
    function MyPagingFunc(ds, row, rowNumber)
    if (rowNumber < pageOffset || rowNumber >= pageStop)
    return null;
    return row;
    function UpdatePage(offset)
    var numRows = dsGallery.getUnfilteredData().length;
    if (offset > (numRows - pageSize))
    offset = numRows - pageSize;
    if (offset < 0)
    offset = 0;
    pageOffset = offset;
    pageStop = offset + pageSize;
    // Re-apply our non-destructive filter on dsStates1:
    dsGallery.filter(MyPagingFunc);
    // Tell our 2nd region to update because we've adjusted
    // some of the variables it uses in its spry:if expressions.
    Spry.Data.updateRegion("list2");
    // Change the XPath for the 3rd data set so that the 3rd
    // region updates. Remember, position() starts at one and
    not
    // zero, so we have to add one to our pageOffset and
    pageStop.
    dsGallery.setXPath("/states/state[position() >=" +
    (pageOffset+0) + " and position() < " + (pageStop+1) + "]");
    -->
    </script>
    <input type="button" value="Prev"
    onClick="UpdatePage(pageOffset - pageSize);" />
    <input type="button" value="Next"
    onClick="UpdatePage(pageOffset + pageSize);" />

    why didn't you use Spry Paged View instead of writing your
    own code?
    then you can use
    if ({ds_PageNumber} == 1 ) {
    //disable prev button & enable next
    else if ({ds_PageNumber} == {ds_PageCount} ) {
    //disable next button & enable prev
    else{
    //enable both prev & next button
    you then just have to call this function, every time you do
    navigation or page load (using observer or anything else)

  • After entering "Country or Region" United States, I do not get a next button to advance through the process.  What might be the cause?

    After entering "Country or Region" United States, I do not get a next button to advance through the process.  What might be the cause?

    Try This...
    Close All Open Apps... Sign Out of your Account... Perform a Reset... Try again...
    Reset  ( No Data will be Lost )
    Press and hold the Sleep/Wake button and the Home button at the same time for at least ten seconds, until the Apple logo appears. Release the Buttons.
    http://support.apple.com/kb/ht1430

  • Sliding panels prev/next buttons

    Using graphic buttons for previous and next navigation with Spry Sliding Panels, how can the 'previous' button be dimmed or hidden when you're on the first slide, and conversly, have the 'next' button dimmed or hidden when you're at the end of the slides? Ideally there would be a CSS class added to one button or the other to change states. Or can the Spry Fade Effect be used here to fade the buttons on and off?

    The default Spry Widget has no functionality to indicate the current panel. I have created a small hack for that before. You might want to check out this post here:  http://forums.adobe.com/message/2175472#2175472
    Hopes this helps.

  • Prev Next Buttons on top of jQuery

    I have a scrolling banner and on the left and right of the image I want to place 2 buttons on top of the image that scrolls.
    I have coded CSS style position:absolute or even relative, which displays fine if jQuery is not used.
    How can I code this to jQuery as the previous and next always sits underneath the image and you cannot see it
    http://www.australiancheapholidays.com/site/
    thanks

    Give the 'dialog' <div> a position of relative:
    .dialog {
    position: relative;
    Then absolutely position your 'prev2' and 'next2' links (z-index, see below) will place the links on top of the banner images.
    #prev2 {
    position: absolute;
    top: 130px;
    left: 30px;
    z-index: 300;
    #next2 {
    position: absolute;
    top: 130px;
    left: 920px;
    z-index: 320;

  • Apex 2.1 (XE) Master/Detail Page Question Regarding Prev/Next Buttons

    When creating a page of type master/detail the master form is auto-populated with two buttons that allow the user to navigate to the previous or next record. These buttons are implemented as submit buttons, which cause the session variables to be updated with the current form values prior to moving to the previous or next record. But no database update happens because the buttons have matching before computation branches that reload the current page. It seems to me as if these buttons should have been implemented as URL redirects so as to not cause the session variables to be updated, especially since they are being updated to values that will not match the newly displayed record. And another problem is that any user changes to items on the form get picked up by the page navigation submittal and are stored into the session's item variables, yet are never persisted to the database. When code on other pages use these item variables, you can get some strange results because of this.
    My current workaround is to store each displayed item into the session during the display of the page (during the rendering phase) using the htmldb_util save_session_state function. This effectively overwrites any errant data in the session variables with what is actually being shown on the screen. (As an aside, if anyone has a better way to cause all the session variables to be updated during the fetch and page rendering step, please let me know, otherwise I will continue hand coding the save_session_state for each item in an anonymous PL/SQL block).
    Ultimately I was wondering if anyone else thought these two buttons should have been implemented by the Apex designers as URL redirects, rather than submit buttons? This would have kept the session data update from happening. Or is there a good reason to have these buttons submitting that I haven't been able to figure out?
    Thanks in advance for any thoughts on the issue.
    - Jim

    Is a before insert trigger not more interesting and safer in your use case?

  • Problem navigating article with prev next buttons

    I place a next and previous button to navigate between pages in the same article using gotonextpage but it stops working after a few times navigating the article. I tried with navto://article# but it did not worked either

    You might have run across an intermittent page link bug in the Adobe Content Viewer. This bug was addressed in a recent hot fix. If you build a custom app (or a new Content Viewer), the issue should be resolved. Or, wait until the viewer is updated in the store.

  • Thinking Outside of The ProTools box

    Will someone experienced in post production sound design and mixing please confirm that Soundtrack Pro 2 is as capable as ProTools for what we do and need to do VERY QUICKLY?
    Boy!... it really hard to virtually start all over with a new way of thinking / learning this platform. Seems like it has some nice features but I need to navigate my regions / clips and timecode locations MUCH QUICKER! Lining up, snapping regions to cursor, grouping tracks, automation, etc...
    Can I really replace ProTools with Soundtrack in it's current form?

    You might want to wander over to the [Soundtrack Pro forum|http://discussions.apple.com/forum.jspa?forumID=743&start=0]. This is the old Soundtrack v1 forum.
    Here's [my take|http://discussions.apple.com/thread.jspa?messageID=6552220&#6552220] on your question.

  • Implement paging (prev/next) for jtable data obtained from database

    Hello all, first time poster and relative newbie to java.
    I am trying to learn java and in the process have stumbled upon this issue.
    I have searched through the forum as well as googled my way around for answers. And though I am more informed than I was, I still am a little stumped.
    I would like to implement a table that pulls data from a database (mysql), limits the results, and include prev/next buttons to traverse through the records.
    I think this involves writing my own AbstractTableModel. And I have seen some examples as such. But could use a little more help.
    I will always be pulling 10 rows, but the columns will change depending on query I am using so implementing a more generic set of methods would be great.. To be specific...
    Table: users
    Columns: userid, ufname, ulname, utype, ustatus, etc....
    For selection purposes I only need to show: userid, ufname, ulname. So I figure I write a query like:
    select userid, ulname, ufname from users limit index, 10
    Where index tells the query where to start from then use the results to populate the jtable. I can do this statically but do not quite understand how to implement the next/prev buttons so that the table pulls the next or previous set of data.
    If this can happen without the need to repaint/refresh the frame that would be great.
    sudo code (with comments) would be ok, but a basic working example of this would be even better.
    thank you in advance, if more information is required please let me know.

    tumbleweeds roll by...........

  • Gallery problem with next/prev buttons

    Hi,
    I'm working on a photo gallery and I have some weird things
    happening, hence the request for help!
    When the gallery opens, you can click on any picture, the
    main one then appears with various buttons:
    1. Click on the image and you go back to the thumbnails -
    fine
    2. Click on the cross button and it's the same - fine
    3. Don't click on the automatic gallery, it's no on yet! :)
    4. Click on previous and the previous image appears - fine
    5. Click on next and the next image appears - nope, that's
    where the problem is!
    For the previous button, I use this code:
    var previous = "none";
    if (_global.currentImage == 1) {
    previous = _global.photoNum;
    } else {
    previous = _global.currentImage-1;
    _global.currentImage is the number related to the thumbnail
    you have clicked.
    _global.photoNum is the total number of pictures
    After this code, there's all the code for the preloader and
    it ends by defining the new current image (
    _global.currentImage = previous;) and loading it (
    mcLoader.loadClip("images/photo"+previous+".jpg",
    _level0.images_mc.holder_mc);).
    The next button is based on the same code:
    var next = "none";
    if (_global.currentImage == _global.photoNum) {
    next = 1;
    } else {
    next = _global.currentImage+1;
    With at the end
    _global.currentImage = next; and
    mcLoader.loadClip("images/photo"+next+".jpg",
    _level0.images_mc.holder_mc);.
    Here is the problem, there are three situation you use the
    next button:
    1. On the thumbnails, you click any image. When the main
    image is loaded, you click first previous, have the new image
    loaded and then you click next. The next image is loaded and it
    works fine.
    2. On the thumbnails, you click the last image. When the main
    image is loaded, you click next. The next image (which is then the
    1st) is loaded and it works fine.
    3. On the thumbnails, you click any image. When the main
    image is loaded, you click next.
    Here is the problem: the next image is not loaded!
    You can see it here:
    www.theminnesotafats.com/gallery
    When you see that the picture is not loaded, you will have to
    refresh the page to make it work again.
    I hope that those explainations are not too long and that
    somebody could help me. Thanks!

    WHEN 'NEXT'.
          PERFORM scroll_end.
    WHEN 'PREVIOUS'.
         PERFORM scroll_left.
    ENDCASE.
    ENDMODULE.                 " USER_COMMAND_7100  INPUT
    *&      Form  scroll_end
          text
         -->RT_COLUMNS text
    form scroll_end tables rt_columns type kkblo_t_columns.
      ENDFORM.
    *&      Form  scroll_left
          text
         -->RT_COLUMNS text
    form scroll_left tables rt_columns type kkblo_t_columns.
      ENDFORM.
    i've tried this....the previous error gone..but now i have another error said " the type kkblo_t_columns. is unknown ".
    really exhausting :P

  • Firefox can't find the file at (a location is specified) when either "Navigate previous" (and next) buttons are pressed in an HTML5 skin (but OK in IE/Chrome).

    I create HTML5 help projects from a package called MadCap Flare. It uses what they call an HTML5 'skin' that sets the style/layout of the page and also includes 'Navigate previous' and 'Navigate next' buttons. When viewing the help and pressing these navigate buttons in IE8 or Chrome 32 there is no problem, but in Firefox 27 I get the following: (typical error for pressing a button on any page)
    "File not found"
    "Firefox can't find the file at /C:/SVN/FlareEnglishOnLineHelp/Output/HTML5_Help_Modeller_Reference/4attrib/idh_jointinterface_element_meshes.htm?TocPath=Modeller Reference Manual|Chapter 5 : Model Attributes|Meshing|_____2."
    " Check the file name for capitalisation or other typing errors."
    " Check to see if the file was moved, renamed or deleted."
    - Because the files and buttons work in other browsers I'm wondering just what is going on here with Firefox>>>>

    I should correct that last entry and state that the | charactacters are generated automatically in the Toc-Path for each 'book' name in the online help, and are not something manually created, whereas the : characters have come from the TOC book topic names (which were manually entered names and are what we would ideally require). But, because 'previous' and 'next' topics within nested TOC books without colon (:) characters CAN be browsed successfully when just | characters are present in the Toc-Path, the limitation would appear to be solely due to the : characters.

  • Webhelp: how to add a Previous and Next button

    I'm using Robohelp 8 and generating Webhelp on a Windows XP machine. The output displays on IE by default.
    My problem is simple: In my Webhelp output, I want a Previous and Next button to appear at the top of each topic. That's all. But I don't see how to set this.
    I don't want to create browse sequences; if select topic B, and I've already opened topic D and Z, I should be able to click the Previous button to go from topic D -> topic B, or the Next button to go from topic Z to topic B.
    Also, how do I open my Webhelp output so that the TOC is open (i.e., all topics are displayed so you don't have to click books to open. Thanks for any help.
    Len

    Hi!
    I found this topic as a search I did for also including Back and Forward buttons into a pop-up help page and have found it very helpful and useful, thanks.
    I am currently using RH 10, do you know of anything withine RH 10 that can be used to do this for us?
    I was also wondering if you might be able to help with a further query I have regarding these buttons:
    Currently, when a user clicks the help button within the web based software, the topic associated to that page will be displayed in a pop-up screen. The Help Menu is not displayed and there is no URL field displayed with a Back and Forward button. If the user clicks a link from this help page to another help page, there is no way of getting them back to the previous page without closing the page and then clicking the help button again.
    The requirement is to have Back and Forward buttons added to the help pages that remembers the history of where the user has been rather than moving them up and down the contents. (This part of the requirement I have now fixed with the help of your response to this initial query.) -  The buttons need to be hidden or inactive if there is no history associated, then becoming active or seen if the user has clicked a link. See the following:
    Click a help button on a required software page – help detects that there is no history and therefore the Back and Forward buttons are not required and are not displayed/enabled (not active).
    IF the user clicks a link on the displayed help, then on the new page of help the Back button will display/enable but not the Forward button as there is no more help been opened from this page (yet).
    If the user then clicks the Back button, the user is taken back to the previous page that was displayed. However, it notices that there is no more history beyond this page and the Back button either disappears or disables (becomes inactive).
    IF the user clicks another link from the second page, this would be the third page of help displayed. The Back button would be displayed/enabled but the Forward button would not be displayed or set as inactive.
    IF the user clicks the Back button from the third page, page 2 would have both Back and Forward buttons active/displayed.
    This would continue with each link to new pages, i.e. the history would recognise the first opened page of help and recognise that there is not anything in front of the new page that has been opened.
    This logic should also work if the user has opened the full help, selected a topic from the menu and then clicked a link from that opened page. The Back button would be displayed/enabled so that the user would be able to go back to the previous page they were on. Same with the Forward button.
    I hope this all makes sense. I wonder if you might be able to point me in the right direction or if this is something that I should talk to our web developer about?
    Many thanks,
    Nicola

  • PREV - NEXT navigation in ViewStack & Tab Navigation container

    Hi,
    I am using a ViewStack container inside a Tab container. There are 2 tabs.
    In the first tab, I have 3 containers for ViewStack and in the
    Second tab, I have 2 containers.
    I am having a single PREV - NEXT (navigation) buttons for the navigation.On clicking the next (navigation) button, it should select the second viewstack container in the first tab [initially the first view stack container in first tab is selected]
    On clicking next again, it should select the next viewstack container & so on...
    Upon further clicking the next button, it should select the first Viewstack container of the second tab & so on...
    When I place the navigation buttons for the ViewStack container, we can get the ViewStack ID & the selectedIndex, so PREV - NEXT navigation functionality can be done.
    But my requirement is:
    On traversing through the NEXT button and on reaching the last screen of the ViewStack container, it is required to go to the next tab's first ViewStack container. It is basically a PREV - NEXT navigation through all tabs and on each ViewStack in a tab container with a single set of PREV - NEXT navigation buttons
    - Sen

    hi,
    I have put together a sample of navigating through multiple viewstacks, the only real need for this to work is that each viewstack is named after its parent navigators index i.e tabnavigator 0 has a viewstack with id of 'VS0' tbanavigator 1 has a viewstack with id of 'VS1' etc...
    http://gumbo.flashhub.net/stacker/  source code included
    David.

  • SetAttribute at calculated attribute at prev next binding

    I use JDev version 10.1.2.1.0 (Build 1913). I try to set attribute at calculated attribute.. that all row divide some page using prev next binding. The result was disorder. I think i must set attribute repeat every i click prev next button.. but i don't know where i must overwrite method form prev next binding.. or any other solution... please give me advice.. thank you

    Dimitar, thank you for your response.
    If I am trying to insert a new row (not update an existing one), I believe I need to create a Managed Property bomEditChild under the Managed Bean bomCRUD, and then set the binding of the af:InputText to +#{bomCRUD.bomEditChild}+ as seen below:
    <af:popup id="p1" ... >
    <af:dialog id="d2" dialogListener="#{DialogListenerCollection.editDialogListener}" title="BOM Edit">
    <af:inputText label="Child" id="it1" binding="#{BomCRUD.bomEditChild}"/>
    </af:popup>
    From adfc-config.xml
    <managed-bean id="__11">
    <managed-bean-name id="__9">BomCRUD</managed-bean-name>
    <managed-bean-class id="__12">erp.view.framework.BomCRUD</managed-bean-class>
    <managed-bean-scope id="__10">request</managed-bean-scope>
    <managed-property id="__2">
    <property-name id="__3">bomEditChild</property-name>
    <property-class>oracle.adf.view.rich.component.rich.input.RichInputText</property-class>
    <value id="__1"></value>
    </managed-property>
    </managed-bean>
    However, when I print the value of the String Child variable of the createChildren class, I get the following:
    System.out.println("Child: " + Child); // output command gets me the text below
    +Child: RichInputText[UIXEditableFacesBeanImpl, id=it1]+
    The createChildren method is detailed below in the pages definition file and implemented in the AppModuleImpl class.
    <methodAction id="createChildren" ...>
    <NamedData NDName="Child" NDValue="#{BomCRUD.bomEditChild}" NDType="java.lang.String"/>
    </methodAction>
    It appears the value being passed into my createChildren class is the container ID, not the value entered into the container by the customer. The output is the same whether I declare bomEditChild as a Managed Property under the Managed Bean bomCRUD or not. I am still unsure how to grab the value of the inputted text and/or if the managed property is updating before the createChildren method is being called via the editDialogListener.
    Any further ideas?

  • URL Links and Next Button conflict

    I've put three clickboxes on a captivate slide, each leading
    to a different URL.
    At the end of the slide, I've placed a NEXT button, set to
    Pause until user clicks. "If user clicks outside of button" is set
    to Infinite Attempts. This is my attempt to hold the slide until
    user has a chance to visit all three URL's.
    Problem: clicking the URL links activates the next button, in
    spite of the "infinite attempts" setting. I think I've found a way
    around this using a series of duplicate slides, but I'm curious
    about why it happens.
    Thanks!
    maggie

    Welcome to our community, Maggie
    When you insert a Click Box object and point it to a URL,
    note there is a button with a down arrow to the immediate right of
    where you type the URL. Click that and you get the option to choose
    to open the project in a new window. I'm guessing you have already
    done this or your complaint would be something else.
    If you click that button a second time, you should then see
    the option to DE-select the option "Continue playing project".
    That's likely what you are looking for. You need to clear this
    option on all the Click Boxes. Once you do this, you should see the
    behavior you are wanting.
    Cheers... Rick

Maybe you are looking for