19 Replies Latest reply: Jan 11, 2014 2:40 PM by rantingrich100 RSS

    Image swap (rollover) plus image map hot spots!

    rantingrich100 Community Member

      I have a single graphic I want to use a RollOver behaviour or an image swap when a user passes his mouse over it.. .Easy enough... BUT! I want as many as 12 Image Hot hotspots that work on the "IMAGE ROLLOVER Graphic"

       

      If anyone wish to see my delemma...

       

      http://www.rantingrich.com/portfoliopage.html

       

      You will see a big rectangular graphic with a bunch of gauges on it! I want it to ROLLOVER to show a new graphic where some of my design work replaces the Gauge dial THEN I want image map hot spots on every gauge!

       

      AS one can see the initail rollover work fine UNTIll one goes over the IMAGE map WHICH I assigned to the original Graphics

       

      ANY CLUES?

       

      Also can send to

       

      [personal information deleted by moderator]

        • 1. Re: Image swap (rollover) plus image map hot spots!
          hans-g. CommunityMVP

          Hello,

           

          looking to your source code I can see this large "graphicdesignsample2.png", in which you have worked in the images. I for my part would use individual images, being disposed adjacent to one another. Here you could mount the hotspots as well as the links.

           

          Only a side effect: You use a directory called "RR2 Graphics samples". I would delete the blanks in it.

           

          Hans-Günter

          • 2. Re: Image swap (rollover) plus image map hot spots!
            rantingrich100 Community Member

            Well dividing up the image is problematic. If you see the image on my page, I want the entire image to swap to the one that looks like a light turns on and shines on the lower gauges… IF i took all the gauges and made them separated images which would leave the large top area image the area with the green word s GRAPHIC DESIGN and the HOOD of the light would roll back over to the OFF image as soon as the mouse rollover it onto the next image

            • 3. Re: Image swap (rollover) plus image map hot spots!
              rantingrich100 Community Member

              Here are a few images! The first one is the DW Image where one can see the Image maps over the first image, 2nd one is the browser shot without the rollover 3rd one is the no sue over rollover …. SEE IMAGES

              • 4. Re: Image swap (rollover) plus image map hot spots!
                Nancy O. CommunityMVP

                I don't view this as a workable web design.  It's all razzle dazzle and no substance.

                 

                #1 there is no real text anywhere on the page which is suicidal because search engines, language translators and screen readers cannot "see" images.  With images disabled, the page is blank.  No real content = no traffic to your site.

                 

                #2 Flash is a dead web technology.  The world's most popular web devices (iPhone, iPad, iTouch, Android, etc...) do not support Flash. Non-Flash supporting devices will not see the "portoflio" animation.   This could be better achieved with Adobe Edge Animate or a combination of jQuery & CSS3 transitions.

                 

                #3 What is the message of your site?  It's not clear what you're trying to communicate.  And since graphic and web design is ALL about good communication, you must make it very clear by telling people who you are, what you do & why people should hire you.  Then let examples of your work speak for itself.

                 

                Best of luck!

                 

                Nancy O.

                • 5. Re: Image swap (rollover) plus image map hot spots!
                  hans-g. CommunityMVP

                  Hhm,

                   

                  --------- del: my answer was not needed ---------

                   

                  Hans-Günter

                  • 6. Re: Image swap (rollover) plus image map hot spots!
                    rantingrich100 Community Member

                    Nancy thanks for the responce.

                     

                     

                    1) The page you are looking at is just my portfolio page and it is far from done.  Obviously you have not gone to the other pages like the home/index pages and YES let my work speak for its self BUT you can't see my work unless you go to my portfolio page and see it. Keep in mind my whole site is a work in progress

                     

                     

                    When i started this web page maybe 8 months ago i was unaware of apple and others dumping FLASH. so I used a cheap flash nag bar at the top and I am still thinking on HOW to just use some image swaps ext.

                     

                    IS there anything else that is still supported by most devices I can use to get some more animation as it were into a dram weaver site?

                     

                    Also i have noticed such devices like my IPHONE won't even play the header animation I have on all my pages...

                    • 7. Re: Image swap (rollover) plus image map hot spots!
                      Nancy O. CommunityMVP

                      Again, look at Adobe Edge Animate (it comes with Creative Cloud membership)

                      http://html.adobe.com/edge/animate/

                       

                      If you're not already a Cloud member, you can join the Creative Cloud for a 30-day trial.

                      http://www.adobe.com/products/creativecloud.html

                       

                       

                      Nancy O.

                      • 8. Re: Image swap (rollover) plus image map hot spots!
                        rantingrich100 Community Member

                        Well now theres a problem and would love to kick the tires of EDGE and all that stuff and already have an account with cloud BUT after I sign in it has a popup about the TERMS but no where to say I agree. Then if I click the X button it goes back to the sign in area and agin I sign in and again get the terms agreement with no way to say I agreed

                        • 9. Re: Image swap (rollover) plus image map hot spots!
                          rantingrich100 Community Member

                          Disregard last e-mail about signing into cloud

                          • 10. Re: Image swap (rollover) plus image map hot spots!
                            rantingrich100 Community Member

                            Okay I am downloading the edge stuff and would love to learn it ans use is, BUT? are they stand alone apps of would one use them like most do flassh? For adding content to Dreamweaver? What I am looking for is some interactivity to my website such as the NAV Buttons where I would get more than one behaviour suah as a simple roll over but even more anain tion plus perhap sound effects.... Will Edge A do that for me then would I add it to my dreamweaver docs?

                            • 11. Re: Image swap (rollover) plus image map hot spots!
                              Nancy O. CommunityMVP

                              The Edge Animate Forum is the place to go for questions about creating Edge projects.

                               

                              Once your Edge project is completed, you can export it and then import it into your DW web page with Insert > Media > Edge Animate composition.

                               

                              That said, I would not build my entire page with Edge Animate, but you can use it for interactive menus, animations, rollovers, etc...

                               

                              NOTE: Edge animations are not visible in pre-IE9 browsers.  If you want to support older, lesser browsers, add IE conditional comments and some alternative text links & images to your HTML page.

                               

                               

                              Nancy O.

                              • 12. Re: Image swap (rollover) plus image map hot spots!
                                Nancy O. CommunityMVP

                                I don't think Edge supports audio as yet.

                                 

                                 

                                Nancy O.

                                • 13. Re: Image swap (rollover) plus image map hot spots!
                                  rantingrich100 Community Member

                                  Nancy do you believe Adobe is going to phase out dreamweaver?

                                  • 16. Re: Image swap (rollover) plus image map hot spots!
                                    Preran Employee Hosts

                                    Thank you, Nancy, Murray.

                                     

                                    Ratingrich100: I am the social lead for Dreamweaver. Whatever you heard is completely untrue. Am hoping that the rumor is laid to rest here.

                                    • 17. Re: Image swap (rollover) plus image map hot spots!
                                      rantingrich100 Community Member

                                      Mister RAN. There was no malice in my question and I did not hear any rumors, I came to that condundrum on my own and it dawned on me, DW days may be numbered.. If that was out of line I am sorry and rest assured if I ever hear of a rumor such as that I will tell them what you told me.

                                       

                                      I must say one reason I came to that logioc was for one, seeing all these other applications such as EDGE A, Flow ect. and the others that seem to be in a BETA phase just got me to wondering. The other reason is that Adobe has a very well documented history of Sand bagging a whole list of superior and long running and broadly used applaciations with ltitle warning or explanation. Now FLASH is on its death bed living on life support

                                       

                                      When Adobe bought out Macromedia (INSERT STAR WARS EVIL EMPIRE MUSIC HERE) and propley killed Freehand, a far superior program to this day than Illustrator, along with Go-live WHICH was adobes own ship ship HTML WYSIWYG Web page design applciation with little warning or explaination. Now while I under stand why Adobe would not WANT to have DUPLICATE applacitions but it does make one wonder WHY? or whats going to happend to a certain program we as customers may of oddles of money on and spent decades using to once again be blindsided with yet another adobe sand bagging yet another program.

                                       

                                      I have a freind WHO uses DW for making webpages. He USE TO set up his client with Contribute so they can update the websites he created in DW. WELL we all now what went down there. Again with little or no warning or explanation.

                                       

                                      I don't think you can blame one or wonder why some of us get nervous when we see some beta apps out and some strange things going on why we may ask the same question I did. And frankly some of us only have rumors to gleem any information about some of Adobes near future actions as Adobes so tight about letting out information concerning ending certain programs that I bet if you but some charcoal up Adobes backside in a month it would be a big diamond, which they would discontinue of course. I have found that the rumor mill is usualy correct as it is germane to adobe products. BUT again My question did NOT Come from any rumor mill or water cooler chatter, just adding up the math....

                                       

                                      Again no malice intended.....

                                      • 18. Re: Image swap (rollover) plus image map hot spots!
                                        Nancy O. CommunityMVP

                                        I can understand your concerns.  Keep in mind that unlike a decade ago when everyone had 800px wide screens and either Mozilla or IE browsers,  the modern web is changing at break neck speed.  We're being asked to develop sites that work on a multitude of platforms & devices with scripting languages that are constantly evolving.  With so much diversity at hand, one must stay on top of the curve or fall hopelessly behind.   Easier said than done.

                                         

                                        GoLive and it's closest competitor, FrontPage simply couldn't keep up with these changes.  I was not surprised by GL's demise.  If anything, I'm surprised Adobe didn't pull the plug on it sooner.

                                         

                                        I never used Freehand so I can't comment on it either way.

                                         

                                        Flash may be dead as a web technology thanks in part to the late Steve Jobs and advances in HTML5, CSS3 and JavaScript (think Edge Animate).  However, it continues to thrive in other sectors such as game development.

                                         

                                        DW  is necessarily evolving by dropping  deprecated features and adding newer, relevant ones.  I believe this bodes well for the longevity of the product.

                                         

                                        That said, I don't think it's possible for one app to deliver everything and do it well.  New technologies shape the need for new solutions. I think that's what Adobe is attempting to address with its line of Edge products, etc....  IMO, these should be regarded as complimentary apps rather than flat out replacements for  DW.

                                         

                                        Just my 2 cents.

                                         

                                        Nancy O.

                                        • 19. Re: Image swap (rollover) plus image map hot spots!
                                          rantingrich100 Community Member

                                          Well I fixed this issue a long time ago but am flattereed so many of you visit my website. I could not make a Website made in DWCS4 WORK when opend and saved as a DWCS6. I rebiult the entire site in CS6 BUT kept the old FLASH nav bars and such and the ROLLOVER HOVER ISSUE was fixed doing this!

                                           

                                          Please feel free to come visit

                                           

                                          www.ranringrich.com

                                           

                                           

                                          Can you beleave that URL as a .com was available?