Add a link to the images in a dynamic Image slideshow

Hello

I have a dynamic image slide show. I would like to include a link to the page for each image and pass a parameter (for example. Company_Id). I don't know how or where to do. I guess I should include the code of the link where I build the page P81_IMAGES element. Please can someone advise me how to do this. Also, if I want to have a different transition effect/slideshow style, how would accomplish this?

My Code is as follows.

I have a process with the following code where I create a page item with my images (of a collection) I want to display header.

declare

cursor c1 is CBC select c001

of apex_collections

where collection_name = "CO_IMAGES";

v_cnt number: = 0;

Start

: p81_images: = null;

for img loop c1

If v_cnt = 0 then

: p81_images: =: p81_images | ' < img src = "#WORKSPACE_IMAGES #" | IMG. CBC | "" alt = "Slideshow Image" class = "active" / > ";

on the other

: p81_images: =: p81_images | ' < img src = "#WORKSPACE_IMAGES #" | IMG. CBC | "" alt = "Slideshow Image" / > ";

end if;

v_cnt: = v_cnt + 1;

end loop;

end;

I have an HTML region where I display the slideshow using the value of element of Page (P81_IMAGES). Source area contains the following items.

< script type = "text/javascript" >

function slideSwitch() {}

var $active = $("#slideshow IMG.active");

If ($active.length == 0) $active = $("#slideshow IMG:last");

This allows to take images in their order of appearance in the tag

var $next = $active.next () .length? $active.next)

: $('#slideshow IMG:first');

$active.addClass('last-active');

$next.css ({opacity: 0.0})

.addClass ('active')

. Animate ({opacity: 1.0}, 3000, function() {})

$active.removeClass ('active last active');

});

}

{$(function()}

setInterval ("slideSwitch()", 2000);

});

< /script >

< style type = "text/css" >

/ * the value width and height to match your images * /.

{#slideshow}

position: relative;

height: 400px;

Width: 460px;

}

#slideshow IMG {}

position: absolute;

top: 0;

Left: 0;

z index: 8;

opacity: 0.0;

}

{IMG.active #slideshow

z-index: 10;

opacity: 1.0;

}

{IMG.last - active #slideshow

z index: 9;

}

< / style >

< div id = "slideshow" >

& P81_IMAGES.

< / div >

I will really appreciate it if someone can guide me here.

Concerning

Dominic

Dominic Dovale wrote:

I have a dynamic image slide show. I would like to include a link to the page for each image and pass a parameter (for example. Company_Id). I don't know how or where to do. I guess I should include the code of the link where I build the page P81_IMAGES element. Please can someone advise me how to do this. Also, if I want to have a different transition effect/slideshow style, how would accomplish this?

My Code is as follows.

I have a process with the following code where I create a page item with my images (of a collection) I want to display header.

Generate the URL of the link required as part of the collection (using the URL APEX syntax if the link is to another page in the application). Wrap the img items in the link elements:

declare
cursor c1 is select c001 src, c002 url
    from apex_collections
    where collection_name = 'CO_IMAGES';
v_cnt number := 0;

begin
    :p81_images := null;
  for img in c1 loop
    if v_cnt = 0 then
      :p81_images := :p81_images || 'Slideshow Image ';
    else
      :p81_images := :p81_images || 'Slideshow Image ';
    end if;
    v_cnt := v_cnt + 1;
  end loop;
end;

and change the IMG elements in jQuery and CSS selectors to a elements:

  

  

&P81_IMAGES.

That said, you should probably consider to implement this requirement with a slideshow plugin regionor a classic report with a custom template for a better separation of concerns.

Tags: Database

Similar Questions

  • [FM11] Print the link to the Image and the markers of Index with the specific character Style

    Hello

    I'm new with scripts for Framemaker. I want to export FM docs to RTF, so I can import into InDesign. For placed images I want to insert a line of text that shows the link to the image (reference). In addition, I want to show the Index markers at the insertion location of brand with a different character Style. Can someone help me with this?

    Best regards, Sjoerd

    Sjoerd Hello,

    A note on your method to retrieve all related graphics: this will also deal with graphics that could be linked in master pages and reference. Just to be safe against unwanted side effects, you should limit your list of charts to those in the main flow of your document.

    On the tLoc: looking for really the cornerstone of the anchored frame that contains the chart. It's a little confusing that FM called the anchored frame and any graph of the same name. Even if you add a framework anchored in the text to an equation or a text box in your document, the anchored frame will appear in the list of the chart in the document. If you have a framework anchored containing an imported graphic file, you have a list of graphic objects inside the anchored frame, who himself appears in the list of graphical objects in the document.

    This function should do what you want to do:

    function ListGraphics (doc)

    {

    var had is doc. FirstGraphicInDoc;

    While (had. {ObjectValid()})

    If (aframe.constructor.name == "Eu") {}

    image = had. FirstGraphicInFrame;

    If (graphic.type is Constants.FO_Inset)

    doc. AddText (had. TextLoc, graphic. InsetFile);

    }

    had had =. NextGraphicInDoc;

    }

    }

    I suppose you also want to remove the anchored frames (imported image files) the text. This can be done in the same routine, but you first have to catch the next element in the linked list graphics in the doc before deleting the current. If you do not delete the first and end up with an object not valid. The method simpler and more secure to do is to create an array of items to delete. After the while loop, you delete these objects. Get the complete code looks like this:

    function ListGraphics (doc)

    {

    var toDelete = [];

    var had is doc. FirstGraphicInDoc;

    While (had. {ObjectValid()})

    If (aframe.constructor.name == "Eu") {}

    image = had. FirstGraphicInFrame;

    If (graphic.type == Constants.FO_Inset) {}

    doc. AddText (had. TextLoc, graphic. InsetFile);

    toDelete.push (had);

    }

    }

    had had =. NextGraphicInDoc;

    }

    for (i = 0; i< todelete.length;="" i++="" )="">

    toDelete [i]. Delete();

    }

    }

    This works on a small test file created. If you are in need of more support, do not hesitate to contact me: jang to jang dot nl

  • Add url link in the 'lightbox' js style gallery

    Hello

    Can someone help me add a url link in the image description? I am using a gallery of "collecting" (prettyphoto) and viewers to be able to visit a site instead of going to the next image when you click on the images that are Web sites.

    Code CSS that I use:

    "< li > < a href="images/work/work-full1.jpg "rel =" prettyPhoto [1] "title =" Trade Show panels - 2011 "" > < img src="images/work/work-thumb1.jpg" > < /a > < /li > ".

    "< li > < a href="images/work/work-full2.jpg "rel =" prettyPhoto [1] "title ="Local Resource site - Lake Wylie, SC"> < img src="images/work/work-thumb2.jpg "> < /a > < /li >"

    and so on...

    See the gallery in action here:

    Click on the work tab.

    http://doubleulabs.com/

    Thanks for any help on this.

    No problem! Well okay, let's try this for the link in the caption box:

    In order to connect the text in the caption box, you need to convert the upper and double quotes or less than signs in your link to their HTML entities (it is because you are currently using the href link would get confused by the regular'<"s being="" used,="" so="" in="" order="" to="" keep="" them="" separated="" for="" the="" code="" to="" be="" read="" correctly,="" we="" convert="" them="" to="" their="">

    For example, if your first link will look like:

  • <a href="yourLink.html">Trade Show Panels - 2011</a>">/>

  • Where > = > and < =

    Où " " = "

    Let me know if that helps!

  • When I add a link to an image, he stops by aligning with text

    I have my icon vertically aligned perfectly with a line of text just after it, but when I add a link to the icon, the text moves to the top of the image (not above it, but just aligned to the top of the image so that it is not centered vertically more). I'm not changing anything, but add the link. I've had this problem before and was not able to fix it...

    If you have created your page from a Dreamweaver template, I'm not surprised that it created images to display: block; Here's what it does:

    The element appears as a block (like headers and paragraphs). A block element has some spaces above and below and tolerate all of the HTML elements next to it

    You can also (if you want to have a space above and below the picture elements) try display: inline-block; Here's what it does:

    The element is placed as an element inline (on the same line as adjacent content), but it behaves like a block element

    Don't forget: display: inline; is the default value.

  • How can I add a link using the adobe reader software?

    How can I add a link using the adobe reader software?

    Hi johnny05,

    This isn't something you can do with Adobe Reader. To edit a PDF file, including adding a link, you must use Acrobat. We invite you to try Acrobat DC for 30 days; You can download a trial of this page: Download Adobe Acrobat free trial version | Acrobat Pro DC.

    Best,

    Sara

  • How to add a link to the page complete multi-page PDF.

    Is it possible to add a link to the full page in multi-page PDF. So anywhere, I click on the page, it will take me to a specific hyperlink.

    I know there is a link to feature, but I can not create an action on its behalf and therefore cannot automate to easily update all the pages and many docs with it. I also looked in invisible buttons, then right clicking on it and the replication of all pages. This will be my last resort if there is no other options but its still not easy to do what I have to re-create the link for each document layer and must reproduce all individually on a page-by-page. Even if not for several files, it would always be very happy to be able to clone an element to link to all pages in a document.

    Else I've tried creating a layer in InDesign with a link and then using the Action to import layers, but that also doesn't seem to work.

    Any ideas?

    Thank you!

    You can use the Javascript method addLink the doc object.

  • link to the image...

    How to create the link to the image?

    I have the link
     <a href="javascript:callwin('P2_X1','P2_X2');">*choose* </a>.
    By on the link I want to use an image instead of using Select, that is to say replace the word Choose with picture...

    How to solve this problem...

    SKUD.

    Hello

    Something like

    <a href="your_link_url"><img src="your_url_for_image" alt="" /></a>
    

    Kind regards
    Jari

  • Link to the image in mySQL problem

    After completing most of the Q & A in this Forum, I can not yet solve the problem with the link of the image failed.

    Here is the link of the image information:

    1. the PHP code to retrieve the image:

    < td > < p > <? PHP echo $row_rsGetDescri ['itemNo'];? > < / p >

    < p > <? PHP echo $row_rsGetDescri ["itemDescri"];? > < / p > < table >

    < td > < img src = "thumbnails / <?" PHP echo row_getnailLink ["nailLink"];? > ' > < table >.

    There is absolutely no problem to recover the database data IE itemNo itemDescri except the images.

    1. the site is still in testing stage with the following data structure:

    dbStructure.png

    the content of the image field, IE nailLink

    file content.png

    the images are stored in this way:

    C:\xampp\htdocs\asiaimperial\thumbnails

    1. the recordset is created:recordset.png

    Your insight on this question of the image link is appreciated.

    Cordially Wen

    Thank you for your quick response.

    The problem is resolved by correcting the name of the W063TBL.jpg file in the path to match a LW063TBL.jpg database.  The incorrect file name so is to arrive first in the record.  If the image will never appear on the screen.  Cordially Wen

  • I want an add-on which opens the images in whatever program I chose

    You know how when you search for a folder in Windows Explorer, you right-click on a type of image file and there is an 'Open with' option where you can select what type of program with which to open/view/modify this image?

    There is an add-on for FireFox that allows me to do the same thing?

    For example, I go to http://icanhascheezburger.com I see an image I like and that you want to save, but I want to open in IrfanView to change before I save it. So in Firefox, I right click on the image and I get the "Open with" menu has if I click right ob the same file after saving it

    An add-on that can do this is Launchy - https://addons.mozilla.org/firefox/addon/launchy/

    Although the description says it allows you to open links and mailto with external applications, you can also set it so that when you right-click on an image you can open the image in your chosen application. See http://gemal.dk/mozilla/launchy.html for more information about configuring Launchy

  • Word 2008 crashes when I add a link to an image

    Hi people,

    I'm running OS X 10.6.8 using word for mac 2008 (version 12.3.6).

    Word hangs when I insert a .png image (using the 'Insert' 'Image' 'From file... (' function to do) and add a hyperlink to this photo (either by "right click & Hyperlink", or "Insert" "Hyperlink"). This is a link to a Web page...

    Now, it is not plant immediately, but only when I move the cursor over the image.

    Does anyone know how to remedy this?

    Thank is advanced!

    Thomas

    Try a reboot.

    Make a backup using Time Machine or a cloning program, to ensure that data files can be recovered. Two backups are better than one.

    Try to set up another admin user account to see if the same problem persists. If back to my Mac is enabled in system preferences, the guest account will not work. The intention is to see if it is specific to an account or a system wide problem. This account can be deleted later.

    Isolate a problem by using a different user account

    If the problem is still there, try to start safe mode using your usual account.  Disconnect all devices except those necessary for the test. Shut down the computer and then put it up after a 10 second wait. Immediately after hearing the startup chime, hold down the SHIFT key and continue to hold it until the gray Apple icon and a progress bar appear. Startup is considerably slower than normal. This will reset some caches, forces a check for directory and disables all start-up and connection, among other things. When you restart normally, the initial restart may be slower than normal. If the system is operating normally, there may be 3rd party applications that pose a problem. Try to delete/disable the third-party applications after a reboot using the UN-Installer. For each disable/remove, you need to restart if you do them all at once.

    Safe mode

  • link to the image slider js will not work

    I'm trying to add a link to a picture in an image in slideshow banner tm_slider. The a href tag does not work. Through adding adding behavior also did not work. Add a hotspot to the .png also did not work. Any suggestions?

    https://micounties.org/

    Nivo slider Wow load URLS.

    Nancy O.

  • How to add URL links in the XML file?

    Hello

    I have a problem with adding the URL links to the power of lightning. I use the XML file to call images, then the corrsponding links. Images are called correctly but when I try to add a link I do not receive the links, but rather to get the anchor HTML text tags. I use escape XML characters to escape HTML tags, but the results are not what I need.

    I use the following code:

    < preview = "miniature large.jpg" thumb = "thumb.jpg" > "
    < title > <! [CDATA [Financial Services]] > < / title >
    < discription > <! [CDATA [& lt; a href = & quot; ]] http://www.google.ca "> Google < / a > " [[ ]] > < / discription >
    < / thumbnails >

    ---------------------------

    Output:

    Images are displayed correctly, but instead get the links, I get following message:

    " < a href =" http://www.Google.ca "> < /a > Google .

    I need to know what I'm doing wrong. I use the proper way to add links or not?

    Thanks for your time.

    Use tags html directly inside CDATA - after all, what CDATA is for.

  • How can I add photo credit for the images used on a blog site?

    I want to use Adobe stock images on a blog site I've created.  By reading the news, I think I need to add a photo credit.  I must add a credit to each image used or I can have a note at the bottom of each page listing the credit?  The format should be copyright, photographer /Adobe Photo Stock or something else?

    Thank you

    Hello

    Please see the frequently asked questions, Adobe Stock

    You can also see How to properly credit a stock Adobe image

    Hope that helps!

    Kind regards

    Sheena

  • Add a link to the language at the top of each page; the master page logo does not...?

    I have a Logo in the master page, and all my pages have this logo, when it comes to adding a link of language on each page it only allows me to put a link and not several 'INTERLANGUAGE links to each of my pages in my Web site creation.

    NEED HELP FOR THIS... ANYONE...?

    I managed to do it myself, maybe I Specifies not or posed the question correctly; I've done the following:

    I caught the layer where the captain: which was the first right up and lowered down, which seemed to help me.  in so doing, I could add links to all my pages in the top left corner, because by the uprising of the page master layer with my logo at the top of the page on the op of all layers trumping any link I would put in all my other pages, by lowering the master page layer to the last section of the layers I was able to make the link in the upper left corner, without him be overshadowed or covered.

    Thank you

    Shawn.

  • Change in the browser now allows adding/changing the links to the images and the text?

    There are images that have a link upwards to the pages of the site and to external sites. When a customer wants to change the image, it needs to link to a new page. Is there a way they can now do this with editing in the browser?

    Hi Andria,

    Editing links is currently not possible with editing in the browser.

    Please this post as a feature request in the following form:

    http://feedback.inbrowserediting.com/?URL=

    Kind regards

    Akshay

Maybe you are looking for