Adding an Image on top of Zoom area
Hello everyone,
I'm a brand new user of Captivate and I'm working with version 4. I'll do my best to not get on your nerves with all the newbie questions!
Current issue - I'm working within a single slide and have a small segment highlighted with the Zoom function. The Zoom is working great, but there are multiple items within the Zoom box that I would like to highlight/indicate for the viewers. I want to use a basic arrow to point at the icon I'm referring to in the audio, so I've tried adding an Image of an arrow, but it always appears behind the Zoom box when I Preview or Publish the project. I've tried using both jpeg and bmp formats for the image and see no difference. I've also tried to work with the Order of the Image and Zoom, setting them to 'Step Back, 'Bring to Front', etc, but it doesn't make a difference.
Any suggestions on how I can get the image to show up on top of the Zoom box?
Side question - I had to find an image of a basic arrow on the web, as all I could find within Captivate 4 are the Animated Arrows. Does Captivate have good old basic arrows and pointers? If so, where might I might find them?
Thanks in advance.
D
Hi there
See if the link below helps any
Click here
For lines and arrows, use Drawing Objects if you are using Captivate 4. Insert > Drawing Objects.
Cheers... Rick
Helpful and Handy Links
Captivate Wish Form/Bug Reporting Form
Adobe Certified Captivate Training
SorcerStone Blog
Captivate eBooks
Similar Messages
-
Use Zoom area for basic (linear) animation -- A-ha moment!
No question here; and, sorry if you already know this; but, had to share...
I've been lamenting that I couldn't -- easily -- get things to move around within a given slide in Captivate. It's easy enough to have things fade in and out using transitions; and, to use Flash (assuming you have access to that) to create and importing your own animations.
But, wouldn't it be nice to have, say, an image be on the screen and have it move from one place to another, and be able to watch it move? And to do it relatively easily?
Well, I had an A-ha! moment today -- creative use of the Zoom area.
Place 2 instances of "imageA" on the slide, at the desired start and stop locations. Let's call them imageA-start and imageA-stop
Insert a Zoom Area.
Modify the zoom area's properties (by double-clicking on both the start and destination areas) so that:
Start Area:
Set the frame width to 0 (so you don't seen any outlines as the image moves across the screen)
Use "no transition"
Destination Area:
Set frame width to 0
Click on "Select image..." and navigate to/select imageA again. This will fill the zoom area's destination area with imageA, which is what you will see "zoom" across the slide
Ensure that both the zoom area's start and destination panes are the same size as imageA-start and -stop, respectively.
Place the zoom area's start pane on top of imageA's start location
Place the zoom area's destination pane on top of imageA's stop location
Adjust the time line to that they go: ImageA-Start|zoom area|imageA-stop --- butting up right next to each other. May need to have the zoom area overlap imageA-stop by a tenth of a second.
Preview it and you should see your imageA slide across the screen more-or-less seamlessly. You'll probably find you need to tweak the size of imageA-stop and/or zoom's destination area. The latter's size properties include an untweakable margin between the destination area's borders and the inserted image
You can even get a bit more creative: make imageA-stop be a bit bigger than imageA-start, and just be sure that the destination area is the same size.
You can adjust the slider in the middle of the zoom area to tweak how quickly the image will zoom.
So, this will allow you to slide an image across the screen. Limited to linear movement and maybe not so sexy -- but, better than what I could do yesterday (without going to Flash, that is)!
If any of you have had your own A-ha! moments, please share!
JoeHi Joe
I've done that as well in a similar fashion. Just use the insert image function of the zoom area without inserting the image actually on the slide as an Image object. Ensure both the zoom area and zoom destination are sized identically (easily done by selecting both and using the sizing options on the context menu)
I'm guessing by saying you may only zoom linearly you meant in a straight line from point A to point B. This is true in that you can't define a "motion path" as you can in Flash. (I know enough about Flash to be dangerous). What that seems to infer though is that perhaps you may only move horizontally from right to left or left to right. But the points may also be diagonal or wherever you need them.
Cheers... Rick
Click here for Adobe Authorized Captivate and RoboHelp HTML Training
Click here for the SorcerStone Blog
Click here for RoboHelp and Captivate eBooks -
I noticed in the Captivate2 demo offered by Adobe, that the
slide on which the zoom area is demonstrated shows the image
inserted in the zoom area moving across the screen. How is this
done? I've looked through Help, but haven't been able to find
anything related to creating motion in a zoom area. Could this have
been created in Flash an imported?
Thanks.
LizHi Mark
Yes, I do understand that. However, it would strike me as odd
if Adobe were to put out a Captivate demo showing what the Zoom
areas do and resort to Flash to accomplish it.
While I do agree generally that once users hit the wall with
certain capabilities of Captivate and will at some point need to
use Flash to stretch a bit beyond them, I feel it shouldn't be the
first concusion that they or others make. I feel they should first
explore the limits of the tool itself before resorting to a
different tool with a much steeper learning curve. Especially if
the tool actually *can* accomplish what they were hoping for. I
guess I compare it to having a flat tire on the road and instead of
cracking open the trunk, just catching a ride to Sears to buy a
large hydraulic jack and a four way, when perfectly acceptable
tools were right there inside the trunk.
Perhaps I'm confused. I know you can't make a zoom area do
curves or swoops, but my little demo seems to indicate it *can*
change position relative to the reference point. I'm interpreting
that to mean moving from point A to point B. I know I have seen
some folks that seem to think you can't move the two zoom areas
apart, but I doubt that's what you are referring to.
Cheers... Rick -
I just really need to know... After desigining my UX, how do I go about adding the image into ADOBE FLASH BUILDER to script on top of it?
Any and all advice is welcome.Do you have different versions of the graphic novel pages, or is there just one version of the page? If there is one version, can you crop into the page without losing anything important?
I would guess that there is one version, and that cropping into the page will lose something important. If that's the case, here's how I would handle it:
Make a stage that is 14:9. The size doesn't matter, but 1400x900 could be a good starting point.
Put down a background texture that fits well with the look of the other images. Make that fill the 1400x900 stage.
Place your page graphics so that they are within the center 1200x788 area of the stage.
Set the stage scalemode to "noBorder".
You now have a layout that will work on all devices, as narrow as iPad, and as wide as iPhone 5. All without any code. On the widest devices you'll see a bit of your background pattern to the left and right of the page graphic. On the narrowest devices you'll see a bit of background pattern above and below the page graphic. But you won't lose sight of anything important. -
Layering images on top of one another and adding hotspots that reveal a different picture below
This is the page Im currently working on http://www.andrewtoyota.com/2014-highlander If you look on the right there is an image of a car with 9 different colored circles below.
First I was trying to find a way to apply a hover effect to the circles to display the correct image of the car with the corresponding color. It wasn't working correctly because I couldn't find a way to have the images lay on top of each other with all the circles (being separate images) to (when clicked) link to the correct car image.
So I brought my images into Dreamweaver and I'm trying to figure out how to do it in there. I know there is a way to apply certain behaviors to images, clickon, but I can't figure out how to lay my images on top of one another. There has to be a div tag to do so right?
I have a jpeg for each image (a horizontal jpg including the text on left then the car then the colors below) I thought if I uploaded all the images then applied a hotspot to each circle on every image then linked that circle to the right image, when clicked, it would work. Its not seeming to work. One problem is all my images are layed on one above the other... I need to get it so only one shows at a time and then get the hotspots to work so when clicked the user is still in the same page just a different image. Either clicked on or hover.
This is what im working with right... I have applied hot spots to the different colors... how do I have only one image showing at once... yet each hot spot linked to the correct image?!You are looking for "remote rollover" or "disjointed rollover" if you were to do a search on Google.
Basically, you have a "starter image" and then when remote images or hotspots are moused over, the starter image is changed to a new image by javascript. There is only ever 1 actual image in the source code on the page at any given time.
Layers (APDivs, position:absolute, etc) is a terrible direction to go for this.
In DWCC...
1. Insert your starting (no rollovers) image
2. Click the image and give it an ID in the Properties window
3. Click/select the link image/hotspot/text that will fire the rollover
4. Click the + in the Behaviors panel and choose Swap Image
5. Select the id of the image set in step 2
6. Browse to the "on" version of the image for the "Set Source To" text field
7. Make sure Preload Images is checked and click OK.
8. Click the + in the behaviors again and choose Swap Image Restore and hit OK
Repeat for each hotspot. -
HTML5 Zoom Are Shows Wrong Image
Hi All,
I have a Captivate 6 Project that is being published ot HTML5. Some of the Zoom areas zoom into what that area looks like later. In other words, I wan to zoom into a menu, instead it sooms into an image that shows later in the slide. The same Zoom works fine or swf output.
Has anyone else noticed this?
TIA - VijayHello,
I'm using Mac OS X Mountain Lion. Here are some screen shots in order:
In the shot below, right in the center of the screen is the word Baseline:
Here is the same slide with the Zoom Area:
And here is later in the same slide where the "Zoomed" image is coming from part of another object which appears later in the timeline:
Thanks much for your help - Vijay -
When double-clicking on the thumbnail image of an iPhoto album, the full size image will often spontaneously zoom to only display the bottom left quarter of the entire photo when it displays in full size. I can easily work around this by clicking on the right arrow to go to the next full size image (which will display properly) and then click on the left arrow to go back to the initial affected image (which will also then display properly). It does not do this when full-sizing all images from their thumbnails - probably less than 10% of the time; but still often enough to be a pian. I cannot find anything in the preferences which would appear to cause or correct it.
It is a recent problem. I have been using iPhoto extensively for many years without any problems. I cannot recall for sure, but it may have started after my update to version 9.4.2.
Using an iMac with plenty of RAM, latest version of iPhoto 11 and Mountain Lion version 10.8.2.What is the format of the PS photos and are there any alpha channels in them? You might try to re-edit them with PS, making some insignificant change and then saving. See if the new edit will display properly. Are you saving as jpgs with the Baseline format?
I may be preaching to the choir here but this may be of interest:
Using Photoshop or Photoshop Elements as Your Editor of Choice in iPhoto.
1 - select Photoshop or Photoshop Elememts as your editor of choice in iPhoto's General Preference Section's under the "Edit photo:" menu.
2 - double click on the thumbnail in iPhoto to open it in Photoshop. When you're finished editing click on the Save button. If you immediately get the JPEG Options window make your selection (Baseline standard seems to be the most compatible jpeg format) and click on the OK button. Your done.
3 - however, if you get the navigation window
that indicates that PS wants to save it as a PS formatted file. You'll need to either select JPEG from the menu and save (top image) or click on the desktop in the Navigation window (bottom image) and save it to the desktop for importing as a new photo.
This method will let iPhoto know that the photo has been editied and will update the thumbnail file to reflect the edit..
NOTE: With Photoshop Elements the Saving File preferences should be configured as shown:
I also suggest the Maximize PSD File Compatabilty be set to Always. In PSE’s General preference pane set the Color Picker to Apple as shown:
Note: to switch between iPhoto and PS or PSE as the editor of choice Control (right)-click on the thumbnail and select either Edit in iPhoto or Edit in External Editor from the contextual menu. If you use iPhoto to edit more than PSE re-select iPhoto in the iPhoto General preference pane. Then iPhoto will be the default editor and you can use the contextual menu to select PSE for your editor when desired. -
Slideshow image resizing when adding new images
I am creating a series of slideshows on multiple pages. I created one slide show using the "basic" slideshow and resized it to the dimensions and settings I wanted. I have many pictures all of different proportion, therefore, I selected the "fill frame proportionally" so they would all fit the dimension I set. I wanted to use this first slideshow as a template for all of the rest. I added images to this first slideshow with no problems. All of my different sized images scaled or cropped to fit within the dimension I set. The problem comes in when I do two things: 1) When I add other images of different dimensions to this same slideshow gallery, they come smaller that the intended dimensions I set previous. I check the setting and it is still on "fill frame proportionally" similar to the first batch of pictures. 2) The second issue is when copy this slideshow as a template to other pages. When I try to replace or add to the slideshow gallery, the images come in cropped or smaller rather than filling the frame. Again, the settings are still the same from my very first slideshow that worked just as i intended.
I could resize all the images to all the same dimensions using another program like photoshop, but that is another step that is very tedious and it would seem that it should be something built into Muse.
Is there a way around this?. Am I doing something wrong? Or is this just one of those glitches that happens with Muse? I appreciate any help that I can get.
Thanks!Hi, I got it to work like this:
Using background colours in Photoshop so that all sizes are the same in pixels. Then manually adjusting thumbnails by double-clicking on them so that a red square appears.
Cheers,
Elsemiek
Op 26 dec. 2014, om 00:50 heeft MediaGraphics <[email protected]> het volgende geschreven:
slideshow image resizing when adding new images
created by MediaGraphics <https://forums.adobe.com/people/MediaGraphics> in Adobe Muse Bugs - View the full discussion <https://forums.adobe.com/message/7043933#7043933>
Hi there Elsemiekagain,
I had to fiddle around with my slide show to get it to work. That is, it worked at first, then went funky, and I had to fiddle. So much fiddling that I can't possibly know what actually made it start to work again.
And to some degree, this is the way that I find Muse to be in general. That it requires finessing to get it to work as expected. This adds a good deal of time to every development project, though I am getting better at this with practice and experience.
Most of it is not even things that could be easily put in words as instructions, as many are nanced. But in fairness, this version of Muse is a complete code re-write this year. So we do need to cut Adobe some slack, and give the team time to iron things out.
If the reply above answers your question, please take a moment to mark this answer as correct by visiting: https://forums.adobe.com/message/7043933#7043933 and clicking ‘Correct’ below the answer
Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page:
Please note that the Adobe Forums do not accept email attachments. If you want to embed an image in your message please visit the thread in the forum and click the camera icon: https://forums.adobe.com/message/7043933#7043933
To unsubscribe from this thread, please visit the message page at , click "Following" at the top right, & "Stop Following"
Start a new discussion in Adobe Muse Bugs by email <mailto:[email protected]ftware.com> or at Adobe Community <https://forums.adobe.com/choose-container.jspa?contentType=1&containerType=14&container=47 59>
For more information about maintaining your forum email notifications please go to https://forums.adobe.com/thread/1516624 <https://forums.adobe.com/thread/1516624>. -
Once I have created a zoom in area I want it to fade away
after so many seconds. How can this be accomplished. I can make the
zoom box fade in and out but not the actual zoomed in picture.
Thank you for your help
TimHello Tim,
There is no fade-in (or out) feature to the Zoom image. But
you can approximate it with a little work.
Use Snagit or RoboScreenCapture to grab a screenshot of the
area beneath the zoom area, and save it as a BMP-formatted image.
Then place that saved image over the top (above - on timeline) of
the zoomed area and fade that image in - slowly - so that as the
new image fades in, the "effect" to the viewer is that of the
underlying part of the background fading out.
HTH -
Photo gallery able to reorganise into subcategories + adding new images via in-browser editing
Hi,
I'm looking for a photo gallery which has the ability to reorganise the images displayed based on subcategories or tags. For example I want to add a gallery which contains photos of a clients projects. The client wants site visitors to be able to shuffle the gallery to view only for example "stone walls" or "timber decking". A tagging system would be handy rather than having to load the photos into each subcategory.
The other consideration is that my client needs to be able to add new images with tags using the in-browser via Business Catalyst. So far I have only succeeded in replacing existing images rather than adding new images.
Is there such a widget for Muse or are there anyother widgets for wordp-ress or other which could be embedded to tdo the job.
Thanks in advance,
JimmyHi Jimmy
If I am not wrong, basically you want to provide users an option to select category of images which they want to show up on page.
From Muse we cannot tag or categorize them , also photogallery module in BC does not provides this option, but there is a workaround with web apps.
You can create a web app and then web app items as images and then categorize them. On page insert the web app with categories drop down, so when users will select the category those web app items would be displayed on page. Additionally you can add custom fields in web app to search using keyword.
With editing , clients can login to BC admin and then using photogallery module or web app module ( if used ) to edit the images, add new ones. IBE cannot be used to add new ones but to replace existing ones.
Helpful Links :
http://helpx.adobe.com/business-catalyst/partner/web-apps.html
http://helpx.adobe.com/business-catalyst/partner/building-web-apps-part-1.html
Thanks,
Sanjit -
Image not displayed correctly in image control at small zoom level
I am displaying an image in an image control with a zoom factor of ~0.015 and it appears as shown in image 1.jpg. When I zoom in a little more to ~0.016 the image is displayed correctly as shown in image 2.jpg. Both images are attached.
Why is the image displayed as a "grey strip" in the first image? What do I need to do to have the image displayed correctly at any zoom factor? I am using LV 2011 with the associated vision development module on Windows 7.
Thanks,
Jonathan-LV
Solved!
Go to Solution.
Attachments:
Image 1.jpg 133 KB
Image 2.jpg 152 KBHi Jonathan,
Did you try resizing your image dimensions, as I suggested in my previous post? Anti-aliasing is an expected behavior; as you zoom out, the image has to be resampled in order to be displayed properly. At some point, LabVIEW assumes that the image has been resampled to the point where it no longer resembles the initial image, and so it greys the image out. In the case of your image, that is not the case. As I said, I believe an acceptable workaround would be to use IMAQ resample to half or quarter the pixel dimensions of your image, at which point it should be able to be displayed at a higher zoom factor.
Best,
Dan N
Applications Engineer
National Instruments -
HTML hovering over thumbnail to bring up larger image on top of it. How?
I am new to site and first question. So hope not too silly. I wish to have lots of small thumbnails on page and when mouse hovers over each individual thumbnail it will enlarge into a larger image - on top of the thumbnail mouse is over. Thanks to Nancy O answering Bravats question on this, I found the following HTML from Nancy, however..... am darned if I am able to have the image hover exactly over the thumbnail. Not to left, not to right, etc etc, but over top of thumbnail. Can someone please tell me what to put in where to make this happen? Thank you.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Disjointed Image Rollovers</title>
<style type="text/css">
/**BEGIN DISJOINTED IMAGE ROLLOVERS**/
#rollover a {
border:none;
text-decoration:none;
padding: 0 0.5em 0 0.5em; /**space between small icons**/
/**remove this rule if all full size images are to share the same display area. **/
#rollover a span {
visibility:hidden;
background-color: #FFF;
display:block;
position: absolute;
/**adjust location of full size images**/
left: 50%;
top: 50%;
/**optional full size image captions**/
font-size: 12px;
line-height: 1.2;
color:#666;
text-align: center;
/**optional full size image borders, padding**/
border: 5px solid orange;
padding: 5px;
#rollover a:hover span, #rollover a:active span, #rollover a:focus span {visibility:visible;}
#rollover a:hover, #rollover a:focus
{visibility:visible;}
/**END DISJOINTED ROLLOVERS**/
</style>
</head>
<body>
<!--begin disjointed rollovers -->
<div id="rollover">
<p>
<a href="#"><img src="SmallIcons/image.png" alt="some description" /><span><img src="FullSize/image.jpg" alt=" " /><br />optional caption #1</span></a>
<a href="#"><img src="SmallIcons/image.png" alt="some description" /><span><img src="FullSize/image.jpg" alt=" " /><br />optional caption #2</span></a>
<a href="#"><img src="SmallIcons/image.png" alt="some description" /><span><img src="FullSize/image.jpg" alt=" " /><br />optional caption #3</span></a>
</p>
</div>
<!--end disjointed rollovers -->
</body>
</html>Here is my Demo. http://alt-web.com/DEMOS/CSS-Disjointed-Image-Rollover.shtml
First, #rollover a needs to have position:relative.
Second, you will need to tweak left & top values to suit your needs.
#rollover a span {
visibility:hidden;
background-color: #FFF;
display:block;
position: absolute;
/**adjust positioning of full size images in px or %**/
left: 0px;
top: -140px;
For better answers, we need a link to your page.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb -
ERROR ITMS-9000: "Images larger than 2000000 pixels are not allowed in books
How to reduce image to resolve following issue ?
ERROR ITMS-9000: "Images larger than 2000000 pixels are not allowed in books
Thanks.Hi there djking!
I have an article for you here that can help you with that issue. The article is all about adding images to your books, and can be found here:
iBooks Author: Add and edit photos and other images
http://support.apple.com/kb/PH2797
Thanks for using the Apple Support Communities!
Cheers,
Braden -
Position problem with four zoom areas at a slide
Hi to all,
my problem, i've made a slide, containing a single picture (periodic table). Then, i added four zoom areas at the elements C, H, S and N. Source areas are 45 by 45 px, target areas are 180 to 180 px. I try to set fixed postions for the targets (Target || position X || Position Y):
Target 1
90
330
Target 2
290
330
Target 3
490
330
Target 4
690
330
The result looks really ugly, size and positions went totally wrong. This is just an examples, sometimes, the target areas are overlap each other, looks like a silly randomizer at work...
Maybe anyone can give me a idea/solution to fix this?
Thanks in advance
MarcIf you use CP5 or CP5.5 I would use Effects in this case: a combination of a motion path and scaling. Try to find the correct combination, save as a custom effect and apply to all the elements where you want the Zoom.
Lilybiri -
HI, I'm really new to this--I downloaded the latest version of Firefox and it asked me to select my add-ons. I have WBE Paste and Workspace Email Zoom added on--don't know if these are important. Please let me know if these should be disabled or are somewhat useful. Thank you!!!
hello, they seem to both be of malicious nature/part of a malware infection on osx named starfield. keep them disabled and/or follow the removal instructions here: [http://ithreats.net/2011/01/17/how-to-remove-starfield/]
Maybe you are looking for
-
Updated to ios7 and iTunes 11.1, Music won't play/phone won't sync
I updated my iPhone 4s to ios7 today. I updated itunes to itunes 11.1 so I could sync it (on a toshibia pc running windows vista). Ever since the update, my Iphone won't play music that I haven't purchased off the itunes store, even though it does ap
-
Hello Friends, I need to add one field in the KB15N screen. I feel that I must use the coding block feature to first add the field in the structure CI_COBL and then follow the rest of the process. Is this is the right approach or is there any other s
-
Dynamically generating a portion of my forms URL
Can I grab the PORT portion of the machine my form is running on? I'm able to resolve the IP Address using sys_context('userenv','ip_address'). I'd also like to grab the Port so I can supply it to the web.show_document built-in I use in my form. I us
-
Cue points in dynamically loaded flv file through netstream
How can i add cue points to a playlist of flv files which are loaded dynamically through an xml files. All the sources i have found over the internet are using flvplayback control :(
-
Why won't my adjustments such as brightness/contrast or hue/saturation apply when I click "OK"?
The adjustments are applied in the preview, however when I click okay the adjustments are not applied and the layer goes back to the original before I tried to make the change.