Copy link to clipboard
Copied
Is there any way I can place a small .jpg on a larger one and render the smaller image clickable (that is, linked to a third page?) I was hoping I could link layers, but that is apparently not possible.
Thanks.
Mike
]
1. Click the Image in Design View to select it
2. In your Properties window (Window > Properties or Ctrl + F3 if it's not open), click the area hotspot tool you want to use (rectangle, circle or polygon)
3. Click and drag the hotspot over the image where you want the link to appear.
4. With the hotspot selected, add the location to the Link field in the Properties inspector.
Yours won't be the same color, but the icons themselves haven't changed location or basic look since introduced...
If you don'
...Copy link to clipboard
Copied
Probably the easiest way, if you're not worried about responsive scaling for mobile devices, would be to just turn the two images into one in Photoshop, add it to the page, then use an Image Map hotspot from the Properties window to link the smaller inset image to wherever you like.
Copy link to clipboard
Copied
thanks Jon,
Sounds simple. How do I use or create an Image hotspot? Am using DWCS4. Responsive format not an issue.
Copy link to clipboard
Copied
1. Click the Image in Design View to select it
2. In your Properties window (Window > Properties or Ctrl + F3 if it's not open), click the area hotspot tool you want to use (rectangle, circle or polygon)
3. Click and drag the hotspot over the image where you want the link to appear.
4. With the hotspot selected, add the location to the Link field in the Properties inspector.
Yours won't be the same color, but the icons themselves haven't changed location or basic look since introduced...
If you don't see the hotspot options, make sure you are in Design View, the image is selected, and that the Properties window isn't collapsed. I don't recall if CS4 had it, but later versions have a tiny triangle on the far right side of the Properties window that collapses/expands the Image Map tools.
Copy link to clipboard
Copied
Very cool! I clicked the hotspot but was unable to drag and drop it over the image. Must I do something else?
Copy link to clipboard
Copied
Sorry, looking back, I guess that wasn't quite as clear as it should have been.
Clicking the tool selects the tool shape (rectangle, circle or polygon).
Once selected, you then go back to the image in Design View to click and drag/draw the chosen shape.
The Properties window should automatically change to the new shape so you can fill in the Link field.
Copy link to clipboard
Copied
Jon,
Below is screen shot of image I'm working with. It's part of a map with
little gnomes placed strategically, each of which will be linked to an
.html page.
Question is - after I mark a particular gnome with a shape - how do I
save/remove the shape that remains over the gnome?
Mike
Copy link to clipboard
Copied
These web forums do not support email attachments. You need to post images directly in a web forum reply - see screenshot.
The code is saved when you save your HTML page.
The Hotspot shapes remain visible in Design View so you can see them.
The shapes are not visible in Live View or when Previewed in browsers EXCEPT in Internet Explorer which puts a distracting blue border around image map hotspots. Try using a different browser.
Copy link to clipboard
Copied
Nancy,
Think I answered my own question (graphic attached to keep me honest), but, the reason I originally asked was based on a new "anomaly". Namely, While working on this page, the functionality of viewing the page live, via F12 or Preview in Browser > Firefox, suddenly stopped. That is, I cannot preview files. I saw this occurred with other users, but none of the answers seemed appropriate.
Thanks, Mike
Copy link to clipboard
Copied
Right-click on open tab and select Open in Browser.
Copy link to clipboard
Copied
When I right click the file, Compare with Remote is the last option shown. There is no Open in Browser.
Copy link to clipboard
Copied
And, when I click File > Preview in Browser >, nothing happens regardless which selection I choose.
Copy link to clipboard
Copied
1) Did you create a local site folder for your project by going to Site > New Site?
2) Have you saved your document (index.html)? And do you see your site folder in the Files Panel (F8)?
Copy link to clipboard
Copied
Nancy,
Yes to all. And the F12 non-functionality applies to 5 different sites that I've been working with for years. Like I said, an anomaly. This has never happened before. Am at a loss(:
Copy link to clipboard
Copied
F12 invokes Real-Time Preview which is different than ordinary Preview in Browsers as it connects to an Adobe server. In my experience, RTP it is prone to failure which is why I use right-click > Open in Browser without the the F12 key.
If you're not able to launch any browser to view your files, then something is wrong with your installation.
Start with Restore Preferences.
Unusual behavior in Dreamweaver? Try restoring preferences.
If that doesn't work, use the CC Cleaner Tool below followed by a software re-install.
Use the Creative Cloud Cleaner Tool to solve installation problems
Copy link to clipboard
Copied
I ran CC Cleaner with no change. I didn't reset preferences because it seemed too big a deal to redo. I did, however, copy the html files, etc., onto a laptop also running DW4 and everything worked perfectly, including viewing in browser.
Only thing I can think of is that the problem began after updating iTunes on the subject desktop yesterday. I subsequently uninstalled everything Apple from my desktop and now, when booting, receive a missing icudt55.dll file System Error (re: APSDaemon.exe).
Might this mean anything to you?
Copy link to clipboard
Copied
See this Apple support article for details on uninstalling iTunes and its related software.
Remove and reinstall iTunes and related software components for Windows 7 and later - Apple Support
Copy link to clipboard
Copied
Thought about reinstalling iTunes, but then thought not. Guess it can't hurt. Will give it a try. Thanks for the push.
Copy link to clipboard
Copied
iTunes reinstalled but Preview - any way you do it - still doesn't work. I did notice though, that the Windows key is disabled. Curiouser and curiouser.
Copy link to clipboard
Copied
Quick question if you're still around, is there a Preferences file i can replace on the non-working computer with one on another computer that I know works? Same folder names and directories.
Copy link to clipboard
Copied
If you're using Creative Cloud, you can Sync settings to the Cloud and then import them from the Cloud. See screenshot.
Copy link to clipboard
Copied
Hi Nancy,
Am working on the .html page on a laptop and all is well with viewing in browsers, although the same problem persists with primary desktop.
Since you w3re so helpful the other day, thought I might mention something that may be of interest to you. If I activate CS4 and Open the "problem" .html page, I still cannot preview in browsers. Then, subsequently and while in the same session, if I open another fiIe, I am unable to preview THAT or any other .html file in any of 4 other sites. On the other hand, if I activate and then Open CS4 and click on a different .html page from a different site, I CAN preview in browsers. Until and unless I then click on the problem .html.
Have renamed and copied the .html file to myriad other names. That's not the issue. Have no idea what is, but thought I'd share this with you.
Copy link to clipboard
Copied
I'm no expert with legacy CS4 as I never used it. My guess is your problem file is corrupted or it contains so many critical code errors it's causing your software to choke.
You might want to open it in a plain text editor like NotePad or Brackets and see if you can isolate the problems.
If that can't be done. Delete it and start over with a similar site page that doesn't have problems in it.
Nancy
Copy link to clipboard
Copied
Image maps don't work on Layers (aka absolutely positioned divs).
Copy link to clipboard
Copied
themeister wrote
Is there any way I can place a small .jpg on a larger one and render the smaller image clickable (that is, linked to a third page?) I was hoping I could link layers, but that is apparently not possible.
Just for your reference you can put a <div> (youre calling it a layer) inside another <div> and have one <div> sit above the other using absolute/relative css positioning.
<div class="large_image">
<div class="small_image">
<a href="#"><img src="small_image.jpg" alt=""></a>
</div>
<!-- end small_image -->
<img src="large_image.jpg" alt="">
</div>
<!-- end large_image -->
Css
.large_image {
display: relative;
}
.small_image {
width: 100px;
height: 100px;
display: absolute;
top: 30px; /* distance from top of large_image
left: 60px; /* distance from left of large_image
}