Roll over to view larger image, click to select

Which combined server behaviors or technologies would allow
me to create a dynamic image gallery of thumbnails that when you
roll over any thumbnail image (images are populated via repeat
region recordset behavior), you can view a larger image. Selecting
a thumbnail would select the larger image version.
I do not need to know how to create the thumbnail images
(this would be achieved via aspjpeg with a repeat region applied to
it) but rather how to make it work as explained.
check out
https://www.schooloutfitters.com/catalog/product_info/pfam_id/PFAM898/products_id/PRO987
for an example.

OK so I'm almost there! A little more help if it's not too much trouble.
I've used the "mouse-over to enlarge" example and it seems to be working.
The images sit together top left (ie. the larger image appears over the top of the smaller image and both top left corners of the images sit in the same x and y position - it appears to grow to the right and down!). Can I change this so that the images sit in the same position bottom right and the image grows bigger, up and right?
Alternatively if it's easier I could do "mouse-over and click", but I need the click to open my image in a new window, sized to the image (so I can still see the main page in the original browser window).
Thanks again
Lopoc

Similar Messages

How to view large images ?

i just updated my phone c601 from symbian anna to belle..may i know how to view large images in the nokia internet browser..i cant change it

sorry,since i have just updated my mobile,i can't show you how large is it,
but i can show you how small is it...
even though i click 'more>view image',
the image that shows me is just that small....
Attachments:
scr000001.jpg ‏102 KB

Viewing Larger Image Version / in New Window/Tab

I have added in the links to larger image files to my lower res images. When I click those images in Preview it takes me out of the page and to a new window to view the larger image. Will this larger image be viewed in antoher tab/window? I see the option to click "Open in new Window/Tab" in the hyperlinks menu. I have not activated that for each image link. Should I?
I want to make sure I don't leave the site and don't maintain a tab to get bak to the page I was on after I view a larger image.

Yes you will need to do it for each link. Wether it opens in a new tab or a new window really depends on what browser the user is using and how they have it set up.

Lagging when rolling over objects, text boxes, images in indesign CS5

I just installed CS5 suite onto my new upgraded machine. In InDesign, whenever I roll the cursor over and object, image, text box, there is about a 1-2 second lag in the cursor, almost like my system freezes as Indesign differentiates between the bounding boxes. My system is brand new and exceeds all system requiremnts for running CS5. Photoshop renders 3D lightning fast and I have encountered no other issues in any of the other Apps so far. Indesing itself runs fine until there are multiple frames on a page at which point just moving the pointer from one side of the screen to the other results in choppin movements and lag. Any help or thoughts would be greatly appreciated.

Set your Live Screen Drawing preference to delayed. Does that help?
Bob

Unable to view large image as "fit on screen"

If I open a large document and want to view it as "fit on screen", the image area appears blank. I can see it in my layers, but unless I am zoomed in at 25% or higher, nothing appears. I'm new to CS5 on Windows 7. I've checked that OpenGL is enabled.

Keep in mind that OpenGL should be working for you, and that disabling it is a workaround, not a fix. With it disabled you lose some OpenGL-specific features, such as smooth zooming and panning, brush size/hardness gesture preview...
Check your video drivers for updates from the manufacturer. New drivers are still coming out that fix bugs like this.
-Noel

How do I make a textbox appear in a PDF made in InDesign CC when the cursor rolls over another textbox?

I'm trying to make a textbox appear in a PDF made in InDesign when the user rolls the cursor over another textbox, and I want it to disappear when the cursor moves off the first textbox. I've tried the following with various setting, and it's just not working for me.
Display a different button on rollover
You can create a hot spot in which clicking or mousing over an object displays another object. To do this, create two buttons, hide one of the buttons, and use the Show/Hide Button action to show and hide the target button.
Create an object to be used as the source button. In the Buttons panel, click the Convert Object To A Button icon.
Place the image you want to be used as the target button, and convert it to a button.
Select the target image and select Hidden Until Triggered at the bottom of the Buttons panel.
The image needs to be hidden in the exported document so that it can be displayed when the source button is moused over or clicked.
Select the source button and create two different actions, one to show the target image and a second to hide the target image.
If you want the image to appear when the mouse hovers over the source button, use the On Roll Over and On Roll Off events. If you want the image to appear when you click the source button and disappear when you release it, use the On Click and On Release events. In either case, use the Show/Hide Buttons action to display and hide the target button. See Make buttons interactive.
Use the Preview panel to test the buttons.

Here's more information about what I'm doing.
1. create text box with a little text
2. turn it into a button (Button 1)
3. create another text box with some text
4. turn this into a button (Button 2)
5. check "Hidden Until Triggered" for Button 2
6. For Button 1, select "On Roll Over" for Event
7. For Button 1, click + to add Action and choose "Show/Hide Buttons and Forms"
8. For Button 1, change icon next to Button 2 into eyeball (which I assume makes Button 2 visible on roll over).
9. For Button 1,, select "On Roll Off" for Event
7. For Button 1, click + to add Action and choose "Show/Hide Buttons and Forms"
8. For Button 1, change icon next to Button 2 into crossed-out eyeball (which I assume makes Button 2 invisible on roll off).
8. Export to PDF with modified smallest file size and include bookmarks and hyperlinks and include appearance for interactive elements.
Both buttons are visible in the PDF, and nothing happens with roll over and off.
What am I doing wrong?

Please could someone tell me if its possible to get my recording to record roll over captions?

Hi All
I am making a recording of some slides in a captivate e learning course to be used as a demo for the course. Please could someone tell me if its possible to get my recording to record roll over captions. If I click on the roll over link rather than let the mouse just roll over it, in the recording it records the caption box but before the mouse path gets to it which gives an inaccurate picture of what happens, if I don't click anything then it doesn't record that I rolled my mouse over it. I'm hoping its a setting somewhere. I did try and add the captions as an image but then it doesn't show a mousepath aaaagggghhhhh!!! Any help or hint would be greatly appreciated.
Janet

Hi there, Janet
I'm confused by your description. Are you saying you have created a Captivate that you are playing back, and recording the Captivate you created using Captivate?
Cheers... Rick
Helpful and Handy Links
Captivate Wish Form/Bug Reporting Form
Adobe Certified Captivate Training
SorcerStone Blog
Captivate eBooks

Using IMAQ Image Display control vs IMAQ WindDraw for large image files

Hello All;
I am designing an application that is currently using IMAQ Image Display control to view large images (5K x 3K and larger). My problem is that these images take 10-20 seconds to load and display, whereas if I use IMAQ WindDraw to display my image in a separate window, it only takes a couple of seconds. My application is designed such that I am making use of the Subpanels in LabVIEW 8.0, and to make it pleasant for the user, the interface is such that my line profile, histograph and image viewer displays are contained within the same GUI (panel).
I read the National Instruments application note regarding displaying of large images, and it did not seem to make a difference. For example, I switched the 'modern' IMAQ Image Display control with the classic Image Display control, since the 'classic' does not contain any of the 3D rendering tools which might slow the process down.
Why is there such a huge difference in loading times if I am trying to do exactly the same thing with both methods? How can I bring the IMAQ Image Display control up to the same speed as the IMAQ WindDraw tool?
I am currently using LabVIEW 8.0 with the latest IMAQ/NI Vision package from NI (IMAQ v7.1?). Thanks.
DJH

Use a property node and select 16 bit image mapping. You can create a control for this or whatever you need. If you select the individual elements, you can get enumerated controls.
Bruce
Bruce Ammons
Ammons Engineering

I would like my pdf to be converted as one large image, word can't recognize the symbols correctly

I have a pdf that contains multiple formulas. I would like it to upload as an image instead of trying to convert to text. How can I force it to do this?

Hi jen_n_mat,
You can log in to your ExportPDF account at: https://cloud.acrobat.com/exportpdf
To convert PDF file to an image, click on 'Select PDF File To Export' -> 'Choose Files From My Computer'
Select the desire file you want to convert then select the file format to 'Image' from 'Export Format' drop down list.
Click on 'Export To JPG'.
Regards,
Florence

RoboHelp 8 HTML WebHelp How to display a larger image of a thumbnail by clicking on or rolling over the thumbnail?

How would you display a larger image of a thumbnail by clicking or rolling over the thumbnail?

Hi there
For a mouseover you would have to add some custom developed JavaScript. You could probably find some pre-made on the web if you poked around.
Generally speaking, any way you slice it you will be using two images. One for the thumbnail and one for the full sized image. You could employ the popup functionalty to pop up the larger image.
I used to simply create DHTML drop-downs and insert the large images in the drop-down area.
Cheers... Rick
Helpful and Handy Links
RoboHelp Wish Form/Bug Reporting Form
Begin learning RoboHelp HTML 7 or 8 within the day - $24.95!
Adobe Certified RoboHelp HTML Training
SorcerStone Blog
RoboHelp eBooks

Why can't I get the image to view larger when you click on a thumbnail?

I thought that there was a way to have the image open up larger in a new little window when you click the thumbnail on a photos page....when I click a thumbnail on my photos page it takes me right to slideshow view and the images are displayed too small to see fine detail (I am a retoucher, so my clients need to be able to see hi res images) I can't find a way to change the size of the slideshow images or to get my thumbnails to click open to a hi res version in a new window. The only solution I can think of is to use a blank template page, make each small image a link to a hidden page with the image at hi resolution....but this would take forever and I would have a gazillion pages on my site that way. Any idea how to get around this. Seems like the older version of iweb didn't have this problem...????
(for an example of what I mean, my site: http://www.katesilsby.com (retouch page) and what old iweb did and what I want to happen: http://web.mac.com/vogier/iWeb/vivian%20ogier/wardrobe.html

(for an example of what I mean, my site: http://www.katesilsby.com (retouch page) and what old iweb did and what I want to happen: http://web.mac.com/vogier/iWeb/vivian%20ogier/wardrobe.html
iWeb2 photos page is completely different from that of iWeb1.
iWeb2 photos page can be retro back to iWeb1, but not without major javascript coding.
or using completely different previewing method for larger image, example: http://hdl.50webs.com/Lytebox/Photos.html

Is is possible to have the images as thumbnails and make it so you can click on them for a larger view and then click them again to have it go back to the original size? In an interactive pdf?

I am designing an interactive catalog in a pdf. Is it possible to have the images as a thumbnail and then click them to enlarge the image and then click again to make them go back to the original size?
Thank you in advance!
Stephanie

It can be done with Show/Hide buttons:
Here's a button created from a small version of the image (notice that it's selected in the image below):
The small button has a Show/Hide Buttons and Forms action. It's action is to make the Larger Image visible (eyeball turned on) with the small image hidden (eyeball turned off).
The large image is also turned into a button (shown below):
Notice the checkbox "Hidden Until Triggered". The large button is hidden until it's triggered by the small button. Clicking on the large image also causes a Show/Hide action which shows the Small button and hides the large button.

Linked images "jump" when rolled over

When rolling over an image being viewed on a page in IE/Mozilla, it seems to "jump" if it is linked to a larger version of the same image. Am guessing it is a setting in Page Properties, but I believe I've changed just about everything with no luck.
The actual code of an example is: <td width="250"><div align="center"><a href="http://www.meistersoftware.com/images/tmp_pkg.jpg"><img src="images/tmp_pkg_tn_f8.jpg" width="140" height="101" alt="sc tmp" /></a></div></td>
Any suggestions? Please be gentle if it's a blatantly obvious error

Would be glad to but it's not online yet. Here's the entire <div> Hopefully, it may shed some light -
<div align="center">
<table width="575" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
<td colspan="3" ><blockquote>
<hr align="center" height="2" width="480" />
</blockquote></td>
<td> </td>
</tr>
<tr>
<td width="17"> </td>
<td width="250"><div align="center"><a href="http://www.meistersoftware.com/images/tmp_pkg.jpg"><img src="images/tmp_pkg_tn_f8.jpg" width="140" height="101" alt="sc tmp" /></a></div></td>
<td width="16"> </td>
<td width="272"><div align="center"><img src="images/pzl_icon_r21.jpg" width="83" height="83" alt="pzl_icon_l" /> <img src="images/pzl_icon_l45.jpg" width="83" height="83" alt="cryptoquote" /></div></td>
<td width="20"> </td>
</tr>
<tr>
<td height="15
"> </td>
<td><div align="center"><strong style="color: #036; font-size: 18px;"><a href="http://www.meistersoftware.com/t_main.html" style="color: #036; font-size: 21px;">TicketMeister</a></strong><a href="http://www.meistersoftware.com/ticketmeister.html"><span style="font-size: 10px; color: #036;">©</span></a></div></td>
<td> </td>
<td><div align="center"><strong style="font-size: 18px; color: #900;"><a href="http://www.meistersoftware.com/z_main.html" style="color: #900; font-size: 21px;">PuzzleMeister</a></strong><a href="http://www.meistersoftware.com/puzzlemeister.html"><span style="font-size: 10px; color: #900;">©</span></a></div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td height="15
" style="font-size: 12px"><blockquote>
<p align="left"> • Print<strong> Raffle Tickets</strong><br />
• Reserved Seating<br />
• Consecutive Numbering<br />
• Chinese Auction Cards</p>
</blockquote></td>
<td> </td>
<td style="font-size: 12px"><blockquote>
<p align="left">• Create and Solve Puzzles<br />
• <span style="font-weight: bold">Boggle</span>, <span style="font-weight: bold">Jumble</span>, <span style="font-weight: bold">Cryptoquotes</span><br />
• All levels of difficulty<br />
• 200,000+ word dictionary</p>
</blockquote></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td><div align="center"><strong><em style="color: #036"><a href="http://www.meistersoftware.com/products/ticketmeister" style="color: #036">ONLY 29.95!</a></em></strong></div></td>
<td> </td>
<td><div align="center"><strong><em style="color: #900"><a href="http://www.meistersoftware.com/products/puzzlemeister" style="color: #900">ONLY 17.50!</a></em></strong></div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td colspan="3" style="font-size: 12px"><blockquote>
<hr />
</blockquote></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td width="250"><div align="center"><a href="http://www.meistersoftware.com/images/bms_pkg.jpg"><img src="images/bms_pkg_tn_f8.jpg" width="125" height="107" alt="sc bms" /></a></div></td>
<td> </td>
<td width="272"><div align="center"><a href="http://www.meistersoftware.com/images/pms_pkg.gif"><img src="images/pms_pkg_tn_f8.jpg" width="152" height="115" alt="tmp tn" /></a></div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td><div align="center"><strong style="font-size: 18px; color: #f00;"><a href="http://www.meistersoftware.com/b_main.html" style="color: #F00; font-size: 21px;">BingoMeister</a></strong><a href="http://www.meistersoftware.com/bingomeister.html"><span style="font-size: 10px; color: #f00;">©</span></a></div></td>
<td> </td>
<td><div align="center"><strong style="font-size: 18px; color: #060;"><a href="http://www.meistersoftware.com/p_main.html" style="color: #060; font-size: 21px;">PrintMeister</a></strong><a href="http://www.meistersoftware.com/printmeister.html"><span style="font-size: 10px; color: #060;">©</span></a></div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td style="font-size: 12px"><blockquote>
<p align="left">• Print <strong>Bingo Cards</strong><br />
• 1-on, 2-on, <em>ANY</em>-on<br />
• Numbers, Pictures or Text<br />
• w/ <strong>Pop-Out Bingo Clipboard</strong></p>
</blockquote></td>
<td> </td>
<td style="font-size: 12px"><blockquote>
<p align="left">• <span style="font-weight: bold">Door Hangers</span>, Envelopes<br />
• Wallet Calendars, <span style="font-weight: bold">Bookmarks</span><br />
• <span style="font-weight: bold">Post Cards</span>, Business Cards<br />
• Even a<strong> Page Numberer</strong>!</p>
</blockquote></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td><div align="center"><strong><em style="color: #F00"><a href="http://www.meistersoftware.com/products/bingomeister" style="color: #F00">ONLY 24.95!</a></em></strong></div></td>
<td> </td>
<td><div align="center"><strong><em style="color: #060"><a href="http://www.meistersoftware.com/products/printmeister" style="color: #060">ONLY 19.95!</a></em></strong></div></td>
<td> </td>
</tr>
<tr>
<td height="9"> </td>
<td colspan="3"><hr /></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td colspan="3" style="font-size: 18px; color: #036;"><div align="center">
<p><strong><a href="http://www.perforatedpaperonline.com"><span style="text-align: center; font-size: 24px;">www.perforatedpaperonline.com</span></a><br />
</strong><span style="text-align: center; font-size: 14px; color: #000;">(Our sibling site)</span></p>
</div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td colspan="3" style="font-size: 18px; color: #036;"><p style="font-size: 14px; color: #000; text-align: center;">We also manufacture<strong> <a href="images/m_paper_supplies.html">blank, pre perforated paper</a></strong> for all of our software.</p>
<p style="font-size: 14px; color: #000; text-align: center; font-weight: bold;">• <strong>door hangers • raffle tickets</strong> <strong>• post cards</strong> • <strong>bookmarks</strong><span style="font-size: 12px; color: #000; text-align: left;"> • </span>bulletins</p></td>
<td> </td>
</tr>
>
</table>
</div>

Fixed Image roll over question....

I am putting the finishing touches on my photography business site (www.colbybrownphotography.com) and came across an interesting problem. Instead of using iWEB's photo gallery pages (which I can't stand) I decided to set up my page as an art portfolio with an "art gallery" feel to it. The photos in my "home" section are set up as links so when I roll over them they list where they are redirecting you, but in my actually gallery they are fixed images. Is there any ability to add roll over text to those photos where I could possible talk about the particular photo that the mouse scrolls over? I knew I would be limited when I decided to use iWeb to put together my site but I have been surprised lately with at least a few of the ideas I figured would be out of its technical reach. Thanks in advance.
Colby

There's also this +Tooltip DHTML Library+. At the following link, mouseover the image there...
http://www.walterzorn.com/tooltip/tooltip_e.htm
...I don't know how easy these scripts are to incorporate into an iWeb site using +HTML Snippets+, but if you get them working, please post back here explaining how you did it.
The following thumbnail viewer is beyond what you were asking for, but anyway, click on the examples here and watch the captions drop down...
http://vikjavev.no/highslide/

Roll over a small photo and above it (or beside) the large photo is displayed

Hi All
What is this called: When you roll over a small photo and
above it (or beside) the large version of the photo is displayed. I
would like to create a photo gallery that works this way. Could
someone tell me what this is called? Or better yet, where I can
learn how to do this? A free tutorial perhaps?

c2design,
> What is this called: When you roll over a small photo
> and above it (or beside) the large version of the photo
> is displayed.
I don't know that the phenomenon has one ultimately correct
name. I
might call that a "click to enlarge" or "rollover to enlarge"
effect.
> I would like to create a photo gallery that works this
> way. Could someone tell me what this is called? Or
> better yet, where I can learn how to do this? A free
> tutorial perhaps?
Flash generally provides many ways to accomplish a desired
task. One of
the easiest ways I can think of to get what you're after is
to create a
button symbol. Put your small image (the "thumbnail," it's
usually called)
into the button's Up frame. Put the large image in the
button's Over (and
perhaps Down) frame. In the Hit frame, put a shape that
represents where
you want someone to roll over in order for the Over frame to
show.
Typically, you'd just put the thumbnail into the Hit frame at
the same
horizontal and vertical position it was in the Up frame.
You could also program this effect with ActionScript, but
since you
posted in the general forum, let's see what you make of the
button approach.
Write back if you still have questions. :)
David Stiller
Adobe Community Expert
Dev blog,
http://www.quip.net/blog/
"Luck is the residue of good design."

Roll over to view larger image, click to select

Similar Messages

Maybe you are looking for