Global change for hotspots on image map

The image underneath my hotspots needed to be changed in
Photoshop. It's on all of the pages, and when the image was
replaced in Dreamweaver, I noticed that all of the hotspots that I
created manually in Dreamweaver were lost. How can I create
hotspots on just one of the pages and have it apply to all of the
pages? (I'm not using templates, by the way.)
I created slices on the image in Image ready, then exported
images and html, but I'm not sure how to incorporate and organize
everything in Dreamweaver.

jgleica wrote:
> I have an image map in my HTML file that contains three
circular hotspots. When
> they're viewed in a browser, each one has a black border
around it after it's
> clicked on. I've seen other help threads on the border
problem talk about
> putting 'border:none" in the IMG tag, but there's no IMG
tag..it's an image map
> and border is already set to "0". The code is below:
> <map name="satelliteLinks">
> <area shape="circle" coords="94,64,41"
> href="
http://gi.leica-geosystems.com/LGISub5x307x0.aspx"
target="_self" />
> <area shape="circle" coords="297,51,48"
> href="
http://www.erdas.com/erdasCompanyNews.aspx"
target="_self" />
> <area shape="circle" coords="517,59,43" href="
http://www.erdas.com"
> target="_self" />
> </map>
>
> Any suggestions would be very helpful as my deadline to
have this complete is
> today!!
>
Thats the way the web works, its an accessibility feature, as
its how
you can tab around the page and see where the links are. Look
at any
website, click the link, and see what happens.
Steve

Similar Messages

  • Black border around hotspots in Image map?

    I have an image map in my HTML file that contains three
    circular hotspots. When they're viewed in a browser, each one has a
    black border around it after it's clicked on. I've seen other help
    threads on the border problem talk about putting 'border:none" in
    the IMG tag, but there's no IMG tag..it's an image map and border
    is already set to "0". The code is below:
    <map name="satelliteLinks">
    <area shape="circle" coords="94,64,41" href="
    http://gi.leica-geosystems.com/LGISub5x307x0.aspx"
    target="_self" />
    <area shape="circle" coords="297,51,48" href="
    http://www.erdas.com/erdasCompanyNews.aspx"
    target="_self" />
    <area shape="circle" coords="517,59,43" href="
    http://www.erdas.com"
    target="_self" />
    </map>
    Any suggestions would be very helpful as my deadline to have
    this complete is today!!

    jgleica wrote:
    > I have an image map in my HTML file that contains three
    circular hotspots. When
    > they're viewed in a browser, each one has a black border
    around it after it's
    > clicked on. I've seen other help threads on the border
    problem talk about
    > putting 'border:none" in the IMG tag, but there's no IMG
    tag..it's an image map
    > and border is already set to "0". The code is below:
    > <map name="satelliteLinks">
    > <area shape="circle" coords="94,64,41"
    > href="
    http://gi.leica-geosystems.com/LGISub5x307x0.aspx"
    target="_self" />
    > <area shape="circle" coords="297,51,48"
    > href="
    http://www.erdas.com/erdasCompanyNews.aspx"
    target="_self" />
    > <area shape="circle" coords="517,59,43" href="
    http://www.erdas.com"
    > target="_self" />
    > </map>
    >
    > Any suggestions would be very helpful as my deadline to
    have this complete is
    > today!!
    >
    Thats the way the web works, its an accessibility feature, as
    its how
    you can tab around the page and see where the links are. Look
    at any
    website, click the link, and see what happens.
    Steve

  • Tutorial/HowTo for Java JFrame image map

    I am a first semester Java student and am required to program a very simple game. I want to paint a Super Mario theme using 30x30 pixel blocks. I have been going through tutorials for a few days on displaying gif/jpg/png within a jframe and all use different methods. Does anyone know of a tutorial that focuses on building a jframe that is filled by a 2d array, each array element being a png?
    I am new to JFrames having spent most my time with console/text only programming.

    Welcome to the Sun forums.
    atozer wrote:
    I am a first semester Java student and am required to program a very simple game. A 'very simple' game would be console based. Perhaps 'hangman' would fit the bill.
    .. I want to paint a Super Mario theme using 30x30 pixel blocks. Huhh.. What does 'theme' mean to you? Searching for 'Super Mario theme' all I could see was hits for the theme music. I take it this would be better described in a screen-shot. Do you have a link to one?
    ..I have been going through tutorials for a few days on displaying gif/jpg/png within a jframe and all use different methods. Does anyone know of a tutorial that focuses on building a jframe that is filled by a 2d array, each array element being a png?1) It is generally not a good idea to consider a root component such as a JFrame, JApplet, JWindow or JDialog to be the 'main area' of the GUI. Instead it is more common/useful to put the main GUI into a JPanel, which can then be put into any of the root level components as needed.
    2) I suspect your tutorial requirements are too specific for any single tutorial. Instead look to tutorials on 2D rendering, and separately to tutorials dealing with images. The 'creating a GUI' part is worthy of its own tutorial as well.
    I am new to JFrames having spent most my time with console/text only programming.And we come back to. A simple game is a console based game.
    If somebody was set on learning to create GUIs, I would recommend they steer clear of GUI based games until they have completed a number of GUI based projects that do not involve custom painting (let alone the intricacies of doing custom painting in a responsive game that renders at nn FPS), which I suspect is what is needed to recreate a Super Mario game.
    KISS!

  • Don't like the Navigation Bar? Try an Image Map.

    I understand the simplicity of the Navigation Bar, but being unable to even move the hyperlinks, let alone change the font without resorting to hacking XML, struck me as too simple. I decided not to use it, instead opting for a hyperlink image map, which is really easy to make using iWeb. I put up directions here:
    http://web.mac.com/jadespace/iWeb/1/Fetish/BEC79E6E-E82F-4AE3-9964-6BA510D46F1E. html

    The image bit is quite a good idea. I had created menus on my page, for the same reason as I wanted my own fonts. It all works perfectly until I decided to add some flags to differentiate the same pages in different languages and I placed my flags in the top area of the page.
    I spent hours trying to understand why they wouldn't work, changing opacity, location, size, until I moved them enough to realise that the top area is restricted to link generated by iweb and if you attempt to place your link to high, it will work in the iweb program but will not publish...
    about 2.5 cm from the top are banned from publishing links
    bernard

  • Image mapping and Master Detail Regions in CS3

    Excellent advice to leave a url. I think I am having a similar problem with conceptualizing datasets for utilization with image mapping. I obviously cannot use the Get Schema via the Attach New Data set icon because I have rendered my own Master region. I am working with CS3. I will launch the site and ask for help from the url.
    Here is:
    http://www.atmfoods.net16.net/
    I need help with this. With the phasing out of tabulated layouts for div based layouts I run into quite a few snags attempting to work around deprecation of tags issues. What am I trying to do here:
    1. Get my spry menu to drop down in the child table and not the parent table aligned top left.
    2. Use image mapping of the thumbnail images in integration with datasets and spry Master/Detail regions, even if hand coded to achieve, for a larger image and data on each thumbnail on an accordion spry widget. I am thinking grid systems for the future of my works and hope to achieve some relative command of grid systems. Without gridlock.

    Hi,
    The dataset name in the NestedDataSet constructor does not go
    in quotes.
    Try var dsCreds = new Spry.Data.NestedXMLDataSet(dsAgents,
    "credentials/cred");
    and see if that helps.
    Don

  • Mistake creating an Image Map

    Hello, I have a problem with my Image Map. Here are my steps:
    1.Create areas for the Image Map
    2.Create the Image Map with areas
    3.upload the image
    4.create the OTH file
    5.Enable rendering information option
    6.Create KM navigation iView and its layout set mode as default
    All references for directories and for my pic are OK but it doesn´t show any Image Map. I need help please!
    Thank you

    Hi,
       You can follow this example:
    In KM, image maps are used for a graphical depiction of folder contents. These objects are displayed using graphics instead of in their normal text form.
    Step 1 – Determine the image you want to use for navigating. This can be any JPG or GIF file. In this example I will reference the file world.gif.
    Step 2 – Configuring an image map. Take your image file world.gif and place it in the system. For our example place the file in the path: …../knowledgemanagement/etc/public/graphics. The subdirectory “graphics” was created within the public folder.
    Step 3 – In the documents folder, create the following folders:
    •  World
         Within the “World” folder, create the subfolders:
         North America
         South America
         Europe
         Asia
    Note: you can create as many folders as you like. This structure will serve as the navigation structure for world.gif image map.
    Step 4 – Determine the navigation coordinates for the image world.gif. Any tool can be used, for this example the tool GeoHTML was used. It is a freeware tool that can be downloaded from http://www.fegi.ru/geohtml.
    •  The following coordinates were determined for the folders:
         North America: 253, 255, 303, 285
         South America: 424, 171, 474,201
         Europe: 368, 43, 418, 73
         Asia: 276, 37, 326, 67
    Step 5 – Create new link-sensitive Areas for the image map. Menu path: Configuration -> Content Management -> User Interface -> Image Maps -> Areas
    Please note, an area would need to be defined for each area on the image map that would be link-sensitive areas.
    Step 6 – Defining an Image Map. In this step the name of the image map will be defined as well as specifying the path of the image, the tooltip, and lastly assigning the areas.
    Step 7 – Configure an Object Type Handling (OTH) file for the image map. OTH files are located in the /oth subdirectory within the /etc repository. Copy an existing OTH file in this subdirectory and copy it to “world.oth”. In This OTH file, define the navigation path, collection renderer, layout controller, action and image map. The OTH file should look as follows:
      <?xml version="1.0"?>
      <ObjectTypeHandler Name="Image Map world"
    Class="com.sapportals.wcm.service.objecttypehandler.GenericObjectTypeHandler">
    <SelectionCriteria>
      <Paths>
        <Path>/documents/World</Path>
      </Paths>
    </SelectionCriteria>
    <Properties>
      <Property Key="rndCollectionRenderer"              Value="ImageMapRenderer"/>
      <Property Key="LayoutController"                   Value="DefaultLayoutController"/>
      <Property Key="rndShowActions"                      Value="false"/>
      <Property Key="rndMap"                      Value="MapOfWorld"/>
    </Properties>
    <Actions/>
    </ObjectTypeHandler>
    Step 8 – Display the image map. For the navigation iView that is being used, ensure that the iView property “Layout Set Mode” is set to default.
    Step 9 – Reload the object type handler in order for the system to read the new oth file world.oth. This can be done by within the Rendering Information link in any navigation iView for a user that is specified in the Debugging Settings (this is done in the user interface configuration).
    Another option to reloading the object type handler would be restarting the J2EE engine.
    Step 10 – In the navigation iView for this mage map, navigate to the image map. In this example, the menu path would be documents/World
    Patricio.
    ps: If you want I can send you complete example.

  • Non rectangular hotspots for image maps

    Hi everyone,
    I've been stuck with this problem for a while. I'm trying to make an image map of sectors in a circle. I have the four coordinates of each sector. How do I determine if the the user has clicked inside a particular sector. Most of the examples for image maps I've seen are for rectangular hotspots. Is there a PointInRegion() method or anything like that??
    Thanks a million for your help!

    Found it out myself!!
    There is a contains() method in the Polygon class that tests if a given point is contained within a polygon

  • Can you create an image map hotspot for an external URL in Dreamweaver CS6?

    Can you create an image map hotspot for an external URL in Dreamweaver CS6?

    Duplicate post: http://forums.adobe.com/thread/1338701?tstart=0

  • Hi I'm trying to find a simple bit of freeware that I can use to image map for creating hotspots on a website.  Any ideas?

    Hi
    I'm wanting to create a pretty complicated image map for a web page so it'll be lot's of polygons.  Does anyone know of a good bit of freeware I can use that will help me work out the coordinates for the image maps?
    Thanks
    Neil

    You could do this in any text or html editor.t I imaging you want a click and drag capability when selecting the areas of the image map. Try looking at some of these. https://www.google.com/search?q=image+map+create+apple+mac

  • How do I update/edit/change an image map in Fireworks CS4 or CS5?

    Hi,
    I've created an imagemap in Fw CS4, exported the image + html file, and it works ok.
    1. I closed Fireworks, then ran it again and re-opened the exported PNG, and could see the hotspots, and could edit/update/add/remove them.
    2. I closed Firewoks again, then moved the exported .png image (the original was a PNG as well) and html file to a different folder.
       Problem: When I open the (exported) image, I can no longer edit the hotspots. The image map still works (in a browser), however.
    Doesn't the HTML file define the hotspots?  How do I update or edit an image map in Fireworks? Do I need to re-import the HTML file somehow? Fw help isn't very helpful on this topic.
    I've also found that Fw seems to change the PNG when exporting it. Is it adding some kind of metadata to the exported PNG?
    I've made sure the "Show slices and hotspots"  button is on. This is really puzzling!
    Environment: Windows XP SP3, Fireworks 10.03.011

    Thanks to you both.
    I think I understand what's happened, and yes, I've overwritten my original PNG
    sigh. Fireworks doesn't really make this obvious!
    That renaming tip is great! We already have a process for making PNGs of marked-up PDFs (so the extension is .pdf.png), so this will fit in just nicely!
    You both ROCK!

  • Image-map hotspot coordinates as variables ?

    I am looking to develop an application that will allow operators to interactively define hotspots (clickable zones) on an image. Once done, this image map will be made available to a Web application, for user interaction (each click will be registered with predefined data that depends on the hotspot clicked). The process is to be repeated for a large number of images – that’s why I need an application, rather than having the operators defining the hotspots through the template/HTML editor.
    My question: Is there a way to define variables for the hotspot coordinates, so that these coordinates - e.g. a rectangle’s corners - can be captured by the operators (typically, through mouse-pointer positioning) ?
    PS: I am not a DreamWeaver developer – but I am looking for the right development platform for this project …

    JavaScript. Probably something you could do with some of jQuery's functions. Preferrably you would simply store the data in a database to avoid file writing permission issues which go against Java's security sandbox model...
    Mylenium

  • Cannot adjust attributes or resize image map hotspots

    Can't figure this one out. It has worked fine in all prior
    versions of Dreamweaver, but for some reason CS3 isn't liking my
    image map hotspots.
    I can't select the hotspots in an image map in design view
    and adjust their attributes in the properties window, or resize
    them in the design view. When I select a hotspot, Dreamweaver
    immediately selects "Multiple CSS-P Elements". So if I try to
    adjust the size of a hotspot it thinks I'm dragging and dropping
    the "Multiple CSS-P Elements" and not the hotspot. I can't edit the
    hotspot attributes either because the properties of the hotspot do
    not stay open; it flashes to the properties of the "Muliple CSS-P
    Elements."
    I've tried creating a new document and recreating the image
    and hotspots, and they work fine. So it must be the way my image is
    coded, nested in divs, the CSS applied to the image, or something
    that isn't allowing me to adjust my hotspots.
    Any ideas?

    Is the image carrying these hotspots within a parent
    container that has the
    overflow style set by any chance?
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    ==================
    "Hesadanza" <[email protected]> wrote in
    message
    news:fmgtdm$o0c$[email protected]..
    > Can't figure this one out. It has worked fine in all
    prior versions of
    > Dreamweaver, but for some reason CS3 isn't liking my
    image map hotspots.
    >
    > I can't select the hotspots in an image map in design
    view and adjust
    > their
    > attributes in the properties window, or resize them in
    the design view.
    > When I
    > select a hotspot, Dreamweaver immediately selects
    "Multiple CSS-P
    > Elements".
    > So if I try to adjust the size of a hotspot it thinks
    I'm dragging and
    > dropping
    > the "Multiple CSS-P Elements" and not the hotspot. I
    can't edit the
    > hotspot
    > attributes either because the properties of the hotspot
    do not stay open;
    > it
    > flashes to the properties of the "Muliple CSS-P
    Elements."
    >
    > I've tried creating a new document and recreating the
    image and hotspots,
    > and
    > they work fine. So it must be the way my image is coded,
    nested in divs,
    > the
    > CSS applied to the image, or something that isn't
    allowing me to adjust my
    > hotspots.
    >
    > Any ideas?
    >

  • Can someone help me and explain how to affect hotspot/image map with css rules or any other way?

    i have problem with hotspot because its position cant be fixed to follow the proportion of the fixed background in different resoulutions.

    You can't affect hotspots at all with css. Here are a couple different options you have available though...
    You could try using multiple images that scale, linking each individual image, instead of hotspots.
    You could also look into "responsive image maps" to get quite a few examples of jquery/javascript run image maps that can be scaled.
    Depending on your image, (for example, if you are linking states on a map) you would be able to use SVG paths and link the paths with javascript.

  • Image map for Dreamweaver from Photoshop

    Hi. How does one convert some of the layers in a Photoshop CS3 graphic to an HTML image map with each layer being a hot spot? This would be very tedious (and not very accurate) doing it manually. Thanks.

    > nothing done by hand could have created anything this precise.
    But take a look at the definition of the hotspots in the HTML code. It is possible that you have a massive definition that will chew up some considerable bandwidth to transmit. (The point ID and others were making.)
    This isn't a problem if all your users are on high speed connections, but if a significant number are on dialup, they might not want to wait for such precision.

  • Unable to Create Image Map Hotspot

    I've got a GIF image inserted into a RoboHelp HTML 8 topic and am trying to create multiple image map hotspots on the graphic. I successfully created the first hotspot (a rectangular one). When I try to create the second, the crosshair cursor displays, but when I drag with the mouse, it fails to draw a box outline. When I release the mouse, nothing happens.
    This behavior is erratic. Sometimes, if I close and reopen the topic, I can draw a hotspot. Other times, if I complete exit and re-launch RoboHelp, I can draw a hotspot. Is this a bug, or is there something I can do to make it work more effectively?

    Do you have many other hotspots in this topic?
    Do you have other dynamic HTML in this topic (Related Topics, See Also, drop-down text, etc.)?
    Have you been performing a lot of Cut/Paste operations prior to experiencing this issue?
    Have you ever hit multiple keys in this topic and caused a RH crash?
    RH places numerically identified data in the <HEAD> section for dynamic HTML entities, in addition to the related, numerically matched code that resides in the BODY section. At some point, these numeric matches can get corrupted (the old fat fingers causing a crash trick, for example). The only cure to that is to delete all the HEAD and BODY data, and then start over. Sorry.
    Good luck,
    Leon

Maybe you are looking for