Skip to main content
Known Participant
July 12, 2019
Question

Content Display on Click of 3 Click Boxes

  • July 12, 2019
  • 4 replies
  • 1111 views

I am using 3 images as Click Boxes. On clicking of these 3 boxes, I should get another pop-up (Or a content box rather) that suggests the user to click next along with some feedback content.

I should be able to click any of these three click boxes randomly and still get the content box.

I am fairly new to Captivate. It would be great if someone can suggest me the solution here.

Cheers

    This topic has been closed for replies.

    4 replies

    graphiasAuthor
    Known Participant
    July 15, 2019

    Wow!! I will need time to go through all the comments and apply this in Captivate.

    Is it possible to share the file I have for anyone of you expert to have a look?

    Lilybiri
    Legend
    July 15, 2019

    That is what I feared, indeed. Sorry, but I decided a while ago not to accept files for debugging.

    If you need something to happen after all clickable areas have been clicked at least once, you need the information in:

    Force Clicking Hotspots: Comparison 2 Workflows - eLearning

    Forced Clicking Hotspots in Fluid Boxes Project - eLearning

    Depending on the type of project. I recommend the workflow with multistate object.

    If you don't need to have something happen after all have been clicked, just the popups, you do not need variables at all. Just create the multistate object with a Normal state which is empty, use a shape with no Alpha nor stroke width. Add a state for each popup and use 'Change State ....' as command for the clickable areas..

    seeker_360yo
    Participant
    July 13, 2019

    pop-up problem? btw in captivate it's defend on your imagination..   you have 3 images on one page right? and if you click it you can see a pop-up? or content box? in captivate it work like this you create a btn per images and point it to the page that have a design like pop-up box and have a close btn to go back to your original page..

    to make it simple its just like next page btn  but its not always next page btn because you have 3 pages .. if you want to learn more you can email me: 

    Lilybiri
    Legend
    July 13, 2019

    Very outdqted workflow,  which (old) version do you use? That is the workflow we had to use in Captivate 4, about 11 years ago.

    Please, do not insert personal data. As a moderator I took them out.

    seeker_360yo
    Participant
    July 13, 2019

    sorry about that.. yes im using captivate 4 11 years ago and now im starting to learn latest version captive 2019 but it's my nature to used my experience on old version.. heheh i hope it works..  because it works for me.. but the side effect is that you create a lot of page and the size of your data is much bigger,,  thanks i hope i can learn more..

    Stagprime2687219
    Legend
    July 12, 2019

    Broadly speaking - Here is what I would do.

    I would create a variable that we might call varClicks

    The content box that is to appear will be hidden.

    All three of your buttons would include an action to increment varClicks as well as an if statement to check the value of varClicks

    such that - if varClicks is equal to 3 show the content box.

    Depending on any other requirements this approach may tweaking.

    Hopefully that makes sense and is helpful.

    Lilybiri
    Legend
    July 12, 2019

    @StagPrime I have full explanation in those blogs I pointed to.

    He is not talking about a forced view, nothing to happen when all has been viewed. In that case no variables are needed.

    I already discussed with you before, that using acounter in case of a forced view, will no work unless you disable the other click boxes. Learner can click three times on the same interactive object.

    Sorry for my popping in, just want to avoid confusion fro a new Captivate user.

    Stagprime2687219
    Legend
    July 12, 2019

    Yes - must disable the other box - to prevent multiple clicks.

    I do this all the time in various projects and it works very well to achieve the desired result.

    I do forget to mention it though, when I offer my approach on that.  

    Lilybiri
    Legend
    July 12, 2019

    Not sure to understand your request fully . You also didn't mention whcih version you are using, nor if you talk aout a non-responsive or a Fluid Boxes responsive project. I wrote two blog posts, comparing two possible workflows, one foe non-responsive, and one for Fluid boxes. Have a look at:

    Force Clicking Hotspots: Comparison 2 Workflows - eLearning

    Forced Clicking Hotspots in Fluid Boxes Project - eLearning

    You say 'use images as click boxes', which may be due to your being a newbie. A click box is an interactive object which is invisible to the learner. Only in 11.5.0.476 is it possible to use an image directly as a button withou having to insert it in a smart shape used as button/. I just published two blogs describing all the types of buttons available in Captivate:

    Which Button Type? - Part 1 - eLearning

    In that first part I explain the old type of buttons. You'll see click box mentioned, but since it cannot be used in a fluid boxes project, I don't explain more about that older type/ The second post talks about the newer types:

    Which Button Type? - Part 2 - eLearning

    You'll find the ibitmap and the svg used as button in this post, as well as the shape button which can be filled with an image.

    graphiasAuthor
    Known Participant
    July 12, 2019

    Hi,

    Thanks for your prompt response. I am using or I have placed the click box on top of these 3 images. (I am aware of the clickbox functionality). The user will basically click these 3 images to reveal their respective content.

    Let's assume these are the 3 click boxes.
    A       B       C

    On clicking any of these boxes randomly, the end result will display a content box. Let's name this Content box as "X"
    The content box basically has the feedback text for the user to take the next step.

    So after clicking these 3 boxes the output would look something like this on the page.


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

    A       B       C

              X

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


    I will anyways read through what you have suggested as well. But please check and let me know if it makes sense to you this time around.

    Lilybiri
    Legend
    July 12, 2019

    Unless you are using a version which is older than Captivate 6 (7 years old), do not use a click box over an image but use a shape button filled with that image. I already mentioned that click boxes are not even supported in a Fluid Boxes project.

    If you are on the most recent version, 11.5, you can even use the image directly as button. Read the last blog for which I posted a link.

    For the content use a multistate object. You can start with a shape, which you make invisible in the Normal state. Then you add 3 states, one for each of the contents A, B and C.  Use the command 'Change state of....' when clicking a button (if you don't change to a button, the click box).

    The blog about forcing clicking hotspots explains that workflow, but adds on top of it, that the next button only appears when all interactive objects have been clicked.

    I suppose here that you do not create a Fluid Boxes project, but a non-responsive project.