Flash / Silverlight is definitely the medium for what you are trying to do, although Canvas and HTML could get you 90% there i think.
Best of luck - and if you figure it out let us know :) Bert On May 4, 2010, at 12:52 PM, Chris Cage wrote: > Mmm, don't think we can go with the canvases and HTML 5. Intriguing though. > > Looks like our client has decided they can live with half as many items to > drag around. This will limit the overlap challenge. They aren't thrilled by > the idea, but they are willing to compromise for initial launch. Then maybe > the whole thing gets built in Flash. We'll see what happens. > > Chris > > -----Original Message----- > From: [email protected] > [mailto:[email protected]] On Behalf Of Bert Grantges > Sent: Monday, May 03, 2010 4:14 PM > To: [email protected] > Subject: Re: [Refresh Austin: 5211] Re: JavaScript triggering from images > > Another thought is that depending on your level of support you dip into HTML > 5 and canvases. Depending on what you want to do that may help as well. > > > On May 3, 2010, at 3:47 PM, Ben Brown wrote: > >> OR, you could create smaller target objects within the image... >> >> For example... >> >> <div style="width:200px; height:200px; background:url(/myimage.png); >> position:relative;"> >> <a href="#" style="display:block; width:50px; height:50px; >> position:relative; top:25px; left:25px;"> </a> >> </div> >> >> This would create a 200x200 box with the image as the background, but >> only a 50x50 clickable area centered inside the box. >> >> hope this helps! >> >> b >> On Mon, May 3, 2010 at 3:39 PM, Garann <[email protected]> wrote: >>> Could you create new transparent objects to be moused over/dragged? If >>> you knew the dimensions of the space available to an image on the >>> bracelet, it seems like you could create "slots" they'd snap into, and >>> then have absolutely positioned links (or something else) over those >>> that the user could interact with. >>> >>> Garann >>> >>> On May 3, 2:21 pm, Chris Cage <[email protected]> wrote: >>>> Thanks for the input so far. >>>> >>>> Doug: >>>> Handles would be great, but unfortunately the nature of the imagery is >>>> such that it really isn't an option. >>>> >>>> Bert: >>>> z-index swapping is actually what we are doing and it works just isn't as >>>> useable as we'd like. Here's a little more detail. >>>> >>>> We are taking images and rotating them with Image Magick. The source >>>> images have extra white space (transparent) around them. They all have to >>>> be the same dimensions regardless of what the actual image is for >>>> alignment purposes. Once we rotate them dynamically, the resulting image >>>> is much larger than we would like it to be (dimensions - not file size). >>>> >>>> These images are then layered around a circle (charms on a charm bracelet) >>>> but overlap quite a bit. In some cases, you can only get to a particular >>>> image by hovering in a space that doesn't seem to be part of the image >>>> (but is because of the transparent canvas). >>>> >>>> We are highlighting the div holding the images on mouseOver so there is an >>>> indication of which can be selected, it's just still not as user-friendly >>>> as we'd like. >>>> >>>> Thanks, >>>> Chris >>>> >>>> From: [email protected] >>>> [mailto:[email protected]] On Behalf Of Doug Boude >>>> Sent: Monday, May 03, 2010 9:48 AM >>>> To: [email protected] >>>> Subject: Re: [Refresh Austin: 5203] JavaScript triggering from images >>>> >>>> How 'bout implementing handles on the images so that draggability is >>>> confined to a very specific area?On Mon, May 3, 2010 at 9:00 AM, Bert >>>> Grantges <[email protected]<mailto:[email protected]>> wrote: >>>> >>>> If your not worried about effecting the appearance of the page, you could >>>> do z-index swapping based on the OnMouseOver event of the div which would >>>> make image selection easier. >>>> >>>> Bert >>>> >>>> ---------------------- >>>> Coming to you from my iPhone. Strange words to be expected. >>>> >>>> On May 3, 2010, at 5:39 AM, Chris Cage >>>> <[email protected]<mailto:[email protected]>> wrote: >>>> Hi folks, >>>> >>>> I have a question that I figured I'd shoot out to y'all just to see if >>>> anyone has an idea. >>>> >>>> Using JavaScript and jQuery we are working on an interface that relies on >>>> a lot of draggable actions. Our challenge is that we have images in divs >>>> that are overlapping and becoming difficult to cleanly select. The images >>>> are PNGs with transparent backgrounds, so they don't 'look' like they >>>> overlap to the user. >>>> >>>> Has anyone been able to select an item by either triggering off an images >>>> opaque pixels or by triggering off an image map? Any other ideas? >>>> >>>> Thanks, >>>> Chris >>>> >>>> -- >>>> Our Web site:http://www.RefreshAustin.org/ >>>> >>>> You received this message because you are subscribed to the Google Groups >>>> "Refresh Austin" group. >>>> >>>> [ Posting ] >>>> To post to this group, send email to >>>> [email protected]<mailto:[email protected]> >>>> Job-related postings should followhttp://tr.im/refreshaustinjobspolicy >>>> We do not accept job posts from recruiters. >>>> >>>> [ Unsubscribe ] >>>> To unsubscribe from this group, send email to >>>> [email protected]<mailto:[email protected]> >>>> >>>> [ More Info ] >>>> For more options, visit this group >>>> athttp://groups.google.com/group/Refresh-Austin >>>> -- >>>> Our Web site:http://www.RefreshAustin.org/ >>>> >>>> You received this message because you are subscribed to the Google Groups >>>> "Refresh Austin" group. >>>> >>>> [ Posting ] >>>> To post to this group, send email to >>>> [email protected]<mailto:[email protected]> >>>> Job-related postings should followhttp://tr.im/refreshaustinjobspolicy >>>> We do not accept job posts from recruiters. >>>> >>>> [ Unsubscribe ] >>>> To unsubscribe from this group, send email to >>>> [email protected]<mailto:refresh-austin%[email protected]> >>>> >>>> [ More Info ] >>>> For more options, visit this group >>>> athttp://groups.google.com/group/Refresh-Austin >>>> >>>> -- >>>> Our Web site:http://www.RefreshAustin.org/ >>>> >>>> You received this message because you are subscribed to the Google Groups >>>> "Refresh Austin" group. >>>> >>>> [ Posting ] >>>> To post to this group, send email to [email protected] >>>> Job-related postings should followhttp://tr.im/refreshaustinjobspolicy >>>> We do not accept job posts from recruiters. >>>> >>>> [ Unsubscribe ] >>>> To unsubscribe from this group, send email to >>>> [email protected] >>>> >>>> [ More Info ] >>>> For more options, visit this group >>>> athttp://groups.google.com/group/Refresh-Austin >>>> >>>> -- >>>> Our Web site:http://www.RefreshAustin.org/ >>>> >>>> You received this message because you are subscribed to the Google Groups >>>> "Refresh Austin" group. >>>> >>>> [ Posting ] >>>> To post to this group, send email to [email protected] >>>> Job-related postings should followhttp://tr.im/refreshaustinjobspolicy >>>> We do not accept job posts from recruiters. >>>> >>>> [ Unsubscribe ] >>>> To unsubscribe from this group, send email to >>>> [email protected] >>>> >>>> [ More Info ] >>>> For more options, visit this group >>>> athttp://groups.google.com/group/Refresh-Austin >>> >>> -- >>> Our Web site: http://www.RefreshAustin.org/ >>> >>> You received this message because you are subscribed to the Google Groups >>> "Refresh Austin" group. >>> >>> [ Posting ] >>> To post to this group, send email to [email protected] >>> Job-related postings should follow http://tr.im/refreshaustinjobspolicy >>> We do not accept job posts from recruiters. >>> >>> [ Unsubscribe ] >>> To unsubscribe from this group, send email to >>> [email protected] >>> >>> [ More Info ] >>> For more options, visit this group at >>> http://groups.google.com/group/Refresh-Austin >>> >> >> -- >> Our Web site: http://www.RefreshAustin.org/ >> >> You received this message because you are subscribed to the Google Groups >> "Refresh Austin" group. >> >> [ Posting ] >> To post to this group, send email to [email protected] >> Job-related postings should follow http://tr.im/refreshaustinjobspolicy >> We do not accept job posts from recruiters. >> >> [ Unsubscribe ] >> To unsubscribe from this group, send email to >> [email protected] >> >> [ More Info ] >> For more options, visit this group at >> http://groups.google.com/group/Refresh-Austin > > -- > Our Web site: http://www.RefreshAustin.org/ > > You received this message because you are subscribed to the Google Groups > "Refresh Austin" group. > > [ Posting ] > To post to this group, send email to [email protected] > Job-related postings should follow http://tr.im/refreshaustinjobspolicy > We do not accept job posts from recruiters. > > [ Unsubscribe ] > To unsubscribe from this group, send email to > [email protected] > > [ More Info ] > For more options, visit this group at > http://groups.google.com/group/Refresh-Austin > > -- > Our Web site: http://www.RefreshAustin.org/ > > You received this message because you are subscribed to the Google Groups > "Refresh Austin" group. > > [ Posting ] > To post to this group, send email to [email protected] > Job-related postings should follow http://tr.im/refreshaustinjobspolicy > We do not accept job posts from recruiters. > > [ Unsubscribe ] > To unsubscribe from this group, send email to > [email protected] > > [ More Info ] > For more options, visit this group at > http://groups.google.com/group/Refresh-Austin -- Our Web site: http://www.RefreshAustin.org/ You received this message because you are subscribed to the Google Groups "Refresh Austin" group. [ Posting ] To post to this group, send email to [email protected] Job-related postings should follow http://tr.im/refreshaustinjobspolicy We do not accept job posts from recruiters. [ Unsubscribe ] To unsubscribe from this group, send email to [email protected] [ More Info ] For more options, visit this group at http://groups.google.com/group/Refresh-Austin
