Odd shaped images as links

For simplicity's sake, let's say I am trying to recreate the US map from here: https://www.politicalpagesdirectory.com/states
I have a bunch of pictures with alpha channel that would make a "map". They would be one next to another and each of them would be clickable link. This means, that some of the alpha channel from one picture would overlap another's visible graphic. I want a user to be able click on any part of the visible graphic and not the invisible (alpha channel) but.  Is it possible in muse to make odd shaped picture links like that?

The short answer to this is no, not to my knowledge. As you can say you can use png's with transparencies but you run into issues of clickability where transparency overlaps another area.
Now that Muse supports SVG's, you could try importing SVG assets that are the exact shape of the "state" of whatever illustration you want; rather than square with transparency. However I am very skeptical about how well this will work.
I would suggest the following:
- Adobe edge animate. Muse supports direct import of oam canvas's and this task is easier in edge animate and if you're not already familiar with it, defo worth spending a bit of time to get used to it - really worthwhile. In short, place assets on timeline, click on action and use onhover and onclick tags with your "action" code. Worth looking at edge commons to simplify your task. See thread: Re: Working with polygon shapes and defining active/non-active mouseover areas (imported shapes)?
-If you insist in doing this in Muse, remember you can make virtually any shaped polygon transparent trigger by stacking transparent squares of different sizes and orientations and then grouping them and then giving it associated hyper link. Bit painstacking work, but will work.
-If you're feeling brave/want to really get stuck in: svg - How to make area be irregular shape not rectangle? - Stack Overflow
Hope this helps

Similar Messages

  • How to make an odd shaped pie chart

    Hi there,
    I was wondering how difficult it would be to translate stats into an odd shaped object, to be divideed up into a pie. Oviously I could make a normal pie. overlay it and split the object up according to the angles, but this would result in un even area mass (ideally the area of each slace should equate to the percentage of each figue).
    Hope this makes sense (my brains feeling slightly mushy thanks for excessive analysis of recycling statistics!
    Kind regards D.E

    DE,
    In a stump chart case like this it would seem appropriate to use the pith as the starting point of the chart.
    The following images show a relatively simple way of making a quite accurate division in connexion with a stump that has a strongly asymmetric shape with reaction wood.
    Always keep a copy of the artwork at different stages.
    I) shows the stump, the stroke/nofill annual rings and the pith as a group kept on top and (mostly) locked in the following steps, the stroked and filled (outer) shape of the stump being worked with.
    II) shows a division aid in the form of a 360 (1 degrees) pie chart, made from a Polar grid with 0 Concentric Dividers and 360 Radial Dividers: the Radial Dividers are extended past the outer circle, and the pie pieces are formed by Pathfinder>Divide.
    III) shows the division aid centred over the pith.
    IV) shows the stump moved on top of the division aid, its fill covering the inner part.
    V) shows the result of Object>Path>Divide Objects Below where the stump has cut the division aid.
    VI) shows the result when the outlying superfluous parts of the division aid have been deleted.
    Now the division aid consists of 360 closed paths, each spanning 1 degree, all starting/meeting at the pith. These should be Ungrouped.
    At any time up to this point, the total stump area may be determined, for older versions the free Telegraphics PathArea Filter may be used (available at http://www.telegraphics.com.au/sw/browse/Filters).
    Now it is easy to select a number of closed paths of the division aid and use the PathArea filter (or whatever) to determine the proportion of the total area (simple division), to adjust by adding/removing and/or undoing/redoing, and then to Pathfinder>Unite (or whatever it is called in the version in question) to create a piece of the pie, and finally to increase the Stroke Weight as desired.
    VII) shows the result of creating the top piece of 11%.
    VIII) shows the result of creating all the pieces (made clockwise one at a time), the three 11% pieces (the first one and the two last ones) chosen to be alike, thus showing the great difference(s) in angles for identical areas.
    This procedure leads to a great number of Anchor Points in the bark; it is possible to get rid of them by scaling the pieces with the pith as the key object, placing the original stump path on top, and Object>Path>Divide Objects Below, then delete the outlying parts.
    It is also possible to move the pieces apart, away from the pith, if there is a wish to hurt the stump (even more).
    The accuracy is well within 0.1% of the total stump area for the least accurate pieces.

  • Question regarding image and links tag

    Hi. Im new to podcasting and have just had my first podcast excepted on itunes.
    Im using garageband.com to store my audio file and copy & pasting the address into itunes to submit it. (http://www.garageband.com/user/wabel/podcast/main.xml)
    What i dont understand is adding an cd cover image and links to a web site.
    I asume its sumular to html, where you type the code with link or image, but where? I cant edit within the above link!
    Please help.

    The "code" for images and links goes into the xml file.
    <?xml version="1.0" encoding="UTF-8"?>
    <rss xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd" version="2.0">
    <channel>
    <ttl>60</ttl>
    <title></title>
    <link></link>
    <language></language>
    <copyright></copyright>
    <itunes:subtitle></itunes:subtitle>
    <itunes:author></itunes:author>
    <itunes:summary></itunes:summary>
    <itunes:owner>
    <itunes:name>John Doe</itunes:name>
    <itunes:email>[email protected]</itunes:email>
    </itunes:owner>
    <itunes:image href="http://example.com/podcasts/everything/AllAboutEverything.jpg" />
    <itunes:category text=" ">
    <itunes:category text=" "/>
    </itunes:category>
    <item>
    <title></title>
    <itunes:author></itunes:author>
    <itunes:subtitle></itunes:subtitle>
    <itunes:summary></itunes:summary>
    <enclosure url=" " length=" " type=" " />
    <guid></guid>
    <pubDate></pubDate>
    <itunes:duration></itunes:duration>
    <itunes:keywords></itunes:keywords>
    </item>
    </channel
    </rss>

  • When I click images or links that should automatically open in a new window, instead a new blank window opens.

    For some time now and after firefox has automatically been updated a few times, I click on images or links which are supposed to open in a new window automatically. A new window opens but it is blank with no toolbars, just an adress bar with nothnig in it.

    mha007, Thank you. I walked through your suggested solutions and finally disabled all add-ons and restarted them one by one. The culprit seems to be ViewSourceWith 0.8.11. Interestingly when it is enabled I had to go to TaskManager to force Firefox to quit.
    Maybe this information will help others. I don't know if the cache clearing etc helped but I would suggest that others start but Bringing up Firefox in Safe Mode (hold shift when you select the icon), disable all add-ons and then start them one by one.
    Of course if you have ViewSourceWith maybe you should just disable it first rather than go through the tedium of restarting each add-on separately. To get to the add-ons when it won't open from the toolbar type about:addons in the address area.

  • The curser includes a text box from a previous image or link when the curser is positioned on the side of the page. i click and it goes away but only to return again on the next launched page. how do i get rid of this?

    the cursor includes a text box from a previous image or link when the cursor is positioned on the side of the page. it will mainly happen when i hit "back" from the page i was on. i click and it goes away but only to return again on the next launched page. i also keep several tabs open and it will carry over to any one of them i go to. how do i get rid of this?
    == This happened ==
    Every time Firefox opened
    == when i upgraded to most recent version 3.6.8

    A number of extensions can cause that problem, you'll need to do a little troubleshooting to find out which extension is causing that to happen for you.
    [http://support.mozilla.com/en-US/kb/troubleshooting+extensions+and+themes]

  • HTML content with images and links blocked

    Hello,
    I very much need some help here because my company needs to send out newsletters to our clients in HTML format soon and so far the email with HTML content is being blocked as spam while text content works fine. Specifically, whenever I add a link or an image in HTML content, the email doesn't go through. I tried sending in multipart format but it is also not sending HTML with images and links. Here is my attempt:
                                    props.setProperty("mail.transport.protocol", "smtp");
                                     props.setProperty("mail.host", "mail.server.com");
                                     props.setProperty("mail.user", "joeuser");
                                     Session mailSession = Session.getDefaultInstance(props, null);
                                     mailSession.setDebug(true);
                                     Transport transport = mailSession.getTransport();
                                     MimeMultipart mp = new MimeMultipart("alternative");
                                     MimeBodyPart htmlPart = new MimeBodyPart();
                                     MimeBodyPart textPart = new MimeBodyPart();
                                     textPart.setText("Just to make it multipart");
                                     htmlPart.setHeader("MIME-Version", "1.0");
                                     htmlPart.setHeader("Content-Type", htmlPart.getContentType());
                                     htmlPart.setContent(strHtmlMessage, "text/html");
                                     mp.addBodyPart(textPart);
                                     mp.addBodyPart(htmlPart);
                                     MimeMessage message = new MimeMessage(mailSession);
                                     message.setHeader("MIME-Version", "1.0");
                                     message.setHeader("Content-Type", mp.getContentType());
                                     message.setHeader("X-Mailer", "Recommend-It Mailer V2.03c02");
                                     message.setContent(mp);
                                     message.setSubject(strSubject);
                                     message.setFrom(new InternetAddress("[email protected]"));
                                     message.addRecipient(Message.RecipientType.TO,
                                             new InternetAddress("[email protected]"));
                                             transport.connect();
                                             transport.sendMessage(message,
                                             message.getRecipients(Message.RecipientType.TO));
                                     transport.close();This code is one of my numerous attempts to make HTML send images and links. Please, let me know if there is a workaround way to make JavaMail send HTML with links and images in the message body. Your help will be greatly appreciated.

    The JavaMail FAQ has information on creating HTML messages, including
    messages with both plain text and HTML. Did you find it?
    BTW, your code has many unnecessary statements, such as setting
    the Mime-Version header, which JavaMail will do for you, and setting
    the Content-Type header, which JavaMail does as a side-effect of the
    setContent or setText calls.
    Other than that, it looks like your code should be correctly creating a
    multipart/alternative message. If the recipient is still rejecting it you
    need to figure out what it is about the message that makes the recipient
    think it's spam. Can you send a similar message using another mailer?
    Can you send the message to a different recipient?

  • Body text cannot contain images or links until we are able to verify your account

    When will you be able to verify my account so I can make an actual post with all the relevant infomation?

    Hi,
    Can you post your question with images and links normally now?
    If still not, please check the emails to confirm your account.
    In addition, this issue is not related to Windows Server 2012 and should not be posted here.
    Regards,
    Arthur Li
    TechNet Community Support

  • What is the best way to add multiple images with links into an email signature?

    I created an email signature with five linked images by:
    * creating new message
    • attached the image
    • adding link to the image
    • copied new email signature
    • under Preferences/Signature added the new signature
    It all works, but some of the emails bounced back. When we removed the images, the email went through.
    I  tried putting all the images into Photoshop and making it all one image, used the slice tool to create a link for each image and brought that single image into the signature, but that didn't work as separate links.
    Any suggestions?

    Hi Bob.
    So what I should have done on my PC for all my files is gone to the File menu and used the Package command which would have converted it into a file with the images in it so they wouldn't need to be relinked.
    From now on I will only be working on Mac (I gave away my PC) but I'm sure I could use a friend's pc (or at a later point install Windows on my Mac). But to use the Package command on PC I need to actually have the images in the correct folder on the PC right?

  • Want to have the invoice image PDF link in the approval Notification

    Hi Gurus,
    We are seeking feasibility of how invoice image PDF link can be included in the Invoice Approval Notification.
    Thanks,
    Ganesh

    So how are you planning on implementing that?

  • Windows.ApplicationModel.DataTransfer. How share image and link in same post ?

    How share image and link in same post  ?

    You can
    share a link and share an image (as an image or
    as a file), but logically speaking all of the data types shared are considered different views of the same thing. The share target will pull out the best format for its target and leave the rest. The share source cannot tell the target how to interpret
    the data.
    See
    Choosing data formats and file types.
    If you want to combine multiple data types in one view then you can combine them in an HTML page. See
    How to share HTML

  • Small images a link to bigger ones.

    Is it possible in iWeb to make a small image a link to a bigger one? In other sites that I have seen you can click on an image and a larger one will come up.
    Pat

    Hi Jonathan,
    When I responded to the OP's question, I assumed she was looking for a way to link to an image larger than the 800x600 maximum allowable size in iWeb, as in this example:
    http://web.mac.com/mark8heaton/iPhoto/treemoving/BEF04635-B86E-4AD3-8064-1761884 E9D6B.jpg
    Wasn't sure of the OP's intentions, just thought she wanted a way to link to a larger, external file, or a larger 'image page' by itself, in iWeb, rather than going directly to a slideshow page.
    Mark

  • Smart collection of image files linked to InDesign documents?

    I would like to create a Smart Collection that finds all of the image files linked to InDesign documents in a specific folder.
    I am the yearbook advisor at school and I need to easily find all of the images that have been placed so that we don't reuse images by mistake.
    I have no scripting experience, so I can't create something myself, and I haven't been able to find anything that does such a thing.
    Many yearbook design software programs do offer something like this - indicating that an image has been used previously.
    I guess it would need to look at the metadata of the InDesign Files for the Linked Files and then pit all of the files found there into a Smart Collection.  Ideally, I would be able to further limit it by file type. ANd to not include Master pages if so desired (although that would just be a bonus!)
    I greatly appreciate any assistance anyone can give.
    Thanks!

    I'd be glad to give it a shot, even though I'm a beginner (and I am afraid I am out of my depth), but i'm missing something obvious because I could download and install the script, but if I try to open it to edit it, I just get gobbeldygook.  Any chance you could paste the script here?
    Again, I really appreciate your help.

  • Keep track of images and links in a datafile

    Hi,
    I have set up replication between my source and destination server. How do images and contents linked in a webpage section replicate?
    I think images and content reffred should be replicated seperately, as a datafile doesnot have a refrence telling images reffered should be moved.
    Now the question is how to move Images and contents that are linked in the webpage along with datafiles.
    One solution is to use SiteStudio section replication. If we use that how to make sure this goes through a work flow and then gets replicated?
    your inputs willl be usefull

    This seems somewhat like an architecture question. Let's assume you have two servers (I'll call them staging and production). You have set the Site Studio Migration Utility to automatically replicate content associated with your site from staging to production. Now in our example, on staging there is a datafile with various images and links to native content that users regularly update. You have a workflow layer applied to all datafiles of your site so that content isn't migrated into production until it has been workflow approved. I'm assuming this is how you are set up (since this is a commonly recommended architecture).
    Now back to the datafile. I'm assuming the images in the datafile (as well as any linked native content) have site specific metadata applied to them, so that the Site Studio Migration utility replicates them into production just like migrates other areas of your site. If that is the case, then it is the responsibility of the workflow approver to verify that all images (and document links) look right before approving the content for auto migration.
    Unfortunately, you may run into a situation like the following... You have a page that lists sales figures every month, and uses an image to visualize those sales figures. You already have a datafile in production for February as well as the associated February graphic. You create an updated sales figure datafile for March, as well as an updated associated image for March. The image migrates into production automatically, before the updated datafile referencing the updated image clears workflow. Your February sales figure page could potentially have the March sales image inside of it. This is a potential problem since there is no concept of a "group approval" for all elements that make up the contents within a datafile. You could add a layer of workflow to all native content and images, but then you'd have to be fairly certain that you were synched up properly. You could also manually migrate, but I can see where this would not be ideal either. Unfortunately, there is no easy answer.

  • Image download link without zip using javascript

    Hi,
    Actually i know this question is not related for this thread but i need technical help
    i want to know how to bring the single image download link can bring for example
    Download
    when i click the download link the image open in a new window but i need to download the image like a zip file download
    how can i done it..
    Thank you.

    >
    Actually i know this question is not related for this threadNot related to this thread or forum, JavaScript questions belong to JavaScript forums.
    Mel

  • Adding image and link at bom matrix.

    Hello Friends,
                         I have added two user defined fields in the matrix at bom form as.
    1.For storing image
    2.For storing link
    Now I want to add image and link through coding but this is giving me error as "This is not user defined item."
    Thanks.

    Mithun,
    Did u make sure that the Columns are Active and Editable..? are they visible..??
    To set the value try the following..
    objEdit = objMatrix.Columns.Item("V_12").Cells.Item(pVal.Row).Specific
    objEdit.String = "www.yahoo.com"
    where objEdit is a Edit text.
    Regards,
    Vasu Natari.

Maybe you are looking for