Skip to main content
Q
quality11
Known Participant
December 15, 2008
Question

hot spot, slice, ???

  • December 15, 2008
  • 5 replies
  • 30772 views
I'm very new to FW and design. What do I do to make the starburst a link in the header of this page: http://mnprom.com/promstore/?

I tried adding a slice, but it didn't work....not sure if I did it right.

Thanks so much for your help in advance!
    This topic has been closed for replies.

    5 replies

    N
    Newsgroup_User
    Inspiring
    December 17, 2008
    heathrowe wrote:
    > I will need to see your live version of the changed page?
    >
    > h
    Going back to the original post, you can't make a link with a background
    image. It's not in the flow of the document. The image must be inline.
    Just another spin on what Heathrow is getting at.

    HTH

    --
    Jim Babbage - .:Community MX:. & .:Adobe Community Expert:.
    http://www.communityMX.com/
    CommunityMX - Free Resources:
    http://www.communitymx.com/free.cfm
    ---
    .:Adobe Community Expert for Fireworks:.
    Adobe Community Expert
    http://tinyurl.com/2a7dyp
    ---
    .:Author:.
    Lynda.com - http://movielibrary.lynda.com/authors/author/?aid=188
    Peachpit Press -
    http://www.peachpit.com/authors/bio.aspx?a=d98ed798-5ef0-45a8-a70d-4b35fa14c9a4
    Layers Magazine - http://www.layersmagazine.com/author/jim-babbage
    heathrowe
    heathrowe
    Inspiring
    December 16, 2008
    I will need to see your live version of the changed page?

    h
    heathrowe
    heathrowe
    Inspiring
    December 16, 2008
    Comment out
    background-image: url(images/webtop-3.jpg);
    background-position: left topl;
    background-repeat: no-repeat;

    in #header (style.css) then Save.

    Open you html page in Dw
    and add your <img > </img> source reference between the <div id="header"> </div> section.

    h
    Q
    quality11Author
    Known Participant
    December 16, 2008
    I already have that in my css:
    #header {
    width: 960px;
    height: 384px;
    float: left;
    background-image: url(images/webtop-3.jpg);
    background-position: left topl;
    background-repeat: no-repeat;
    clear:both;
    }
    Here's my html -- that's not working. I add an image tag to the html?

    <div id="header"><a href=" http://clicks.skem1.com/survey/?c=2165&id=1&preview=1"></a><span class="hidden">Top 10 Prom 2009, The Best Of The Best!</span></div>
    heathrowe
    heathrowe
    Inspiring
    December 16, 2008
    Sorry my mistake, referring to js code. Please ignore that.

    You may need to redefine your original div/css so that the right side contains your linked image.

    h
    Q
    quality11Author
    Known Participant
    December 16, 2008
    What do you mean?
    heathrowe
    heathrowe
    Inspiring
    December 15, 2008
    The Slice should work.. (Add Slice, Add Link information in the PI, Export as Html/Images)

    You have to copy over the necessary javascript (slice) information (from the exported html/Images) file to your final design file.

    Or

    If you use Dreamweaver
    Select the image, then in the Property Inspector (lower left) use the HotSpot/Image Map Tool options (Rectangle, Circle Polygon) and then set the Link, Target, Alt options for the Hotspot and your good to go.

    h

    Q
    quality11Author
    Known Participant
    December 15, 2008
    The only thing is that the header image (webtop)is set in the css:

    #header {
    width: 1007px;
    height: 384px;
    float: left;
    background-image: url(images/webtop-3.jpg);
    background-position: left topl;
    background-repeat: no-repeat;
    clear:both;
    }

    Can I make the whole # top div a link in DW?
    Q
    quality11Author
    Known Participant
    December 15, 2008
    I just followed your FW directions. I had done all that following the Help but it left off the exporting and copying.

    But now there are slices in my images file and an htm image. Where do I copy js? I opened the htm image and copied the code below. But no js and I wouldn't know where to put this anyway since the image is in css. I'm so confused.

    <!-- saved from url=(0014)about:internet -->
    <html xmlns=" http://www.w3.org/1999/xhtml">
    <head>
    <title>webtop-3.jpg</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <style type="text/css">td img {display: block;}</style>
    <!--Fireworks 8 Dreamweaver 8 target. Created Mon Dec 15 15:09:09 GMT-0500 (Eastern Standard Time) 2008-->
    </head>
    <body bgcolor="#ffffff">
    <table border="0" cellpadding="0" cellspacing="0" width="1007">
    <!-- fwtable fwsrc="Untitled" fwbase="webtop-3.jpg" fwstyle="Dreamweaver" fwdocid = "1857211728" fwnested="0" -->
    <tr>
    <td><img src="spacer.gif" width="686" height="1" border="0" alt="" /></td>

    <td><img src="spacer.gif" width="256" height="1" border="0" alt="" /></td>
    <td><img src="spacer.gif" width="65" height="1" border="0" alt="" /></td>
    <td><img src="spacer.gif" width="1" height="1" border="0" alt="" /></td>
    </tr>

    <tr>
    <td colspan="3"><img name="webtop3_r1_c1" src="webtop-3_r1_c1.jpg" width="1007" height="146" border="0" id="webtop3_r1_c1" alt="" /></td>
    <td><img src="spacer.gif" width="1" height="146" border="0" alt="" /></td>
    </tr>

    <tr>
    <td rowspan="2"><img name="webtop3_r2_c1" src="webtop-3_r2_c1.jpg" width="686" height="236" border="0" id="webtop3_r2_c1" alt="" /></td>
    <td><a href=" http://clicks.skem1.com/survey/?c=2165&id=1&preview=1http://clicks.skem1.com/survey/?c=2165&id=1&preview=1"><img name="webtop3_r2_c2" src="webtop-3_r2_c2.jpg" width="256" height="216" border="0" id="webtop3_r2_c2" alt="Win a $100 Gift Certificate from Top 10 Prom, The Best of The Best!" /></a></td>
    <td rowspan="2"><img name="webtop3_r2_c3" src="webtop-3_r2_c3.jpg" width="65" height="236" border="0" id="webtop3_r2_c3" alt="" /></td>
    <td><img src="spacer.gif" width="1" height="216" border="0" alt="" /></td>
    </tr>
    <tr>
    <td><img name="webtop3_r3_c2" src="webtop-3_r3_c2.jpg" width="256" height="20" border="0" id="webtop3_r3_c2" alt="" /></td>
    <td><img src="spacer.gif" width="1" height="20" border="0" alt="" /></td>

    </tr>
    </table>
    </body>
    </html>
    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices