5 Replies Latest reply on Jan 28, 2013 8:32 AM by bertyhell123456
      • 1. Re: My latest site
        salesdigital Level 1

        nice and clean!

        • 2. Re: My latest site
          heathrowe Most Valuable Participant



          I am seeing different behaviors with the browsers. Ie10 there are no 'click' or mouseover actions occurring.

          Chrome seems to 'skip' a beat with some of the circlular rotations occuring on its own.


          Love the concept and the crisp graphics.


          • 3. Re: My latest site
            bertyhell123456 Level 1

            have you tried it in IE9?

            it's a disaster




            apperantly svg images with a css transform on them, are not getting rendered very well.

            • 4. Re: My latest site
              salesdigital Level 1

              ouch -


              what if you did the "transforms" in illustrator - and then exported that svg or png for that matter, both produce a file of approxiately the same k.


              i did a quick test, displays fine in ie9  http://salesdigital.com/bendsvg/


              i also noticed the mouseover on the features button is fiddly.  are you using a transparent hit zone?


              i think a few small replacements would make this shine across the board.


              great work!



              • 5. Re: My latest site
                bertyhell123456 Level 1

                for the text transformations this could be the case (the bend effect is already done in illustrator)

                only the rotation effect isn't --> this could be an improvement on my part


                but the grey button background is the same file rotated 5 times (1/5th of the filesize)


                i first tried to do those circlesegments with css box-radius and clip and transform: rotate --> but the mouse hit test doesn't take the css clip-property in account.



                the mouse over is done on the svg grey circlesegment. but because the hover effect makes the segment transparent i had to add a css segment behind it so you wouldn't see the hidden content behind those buttons.

                The combination of svg text with behind it an animated semi transparent svg with behind that a css generated circlesegment is indeed pretty heavy to render.


                most of these problems are fixable but would probably increase filesize.