Yeah this script is a little under 3k. And it can create the pressed state and standard state and you see in the example. I bet it could be optimized to be even smaller.
So do you know if there is a way to make the canvas work easily with multiple resolutions? I'll post my CSS version next week. It's currently integrated in a project and I need to separate it out when I have a few moments. - Jordan On Thu, Aug 5, 2010 at 1:14 AM, Remi Grumeau <[email protected]>wrote: > Pretty cool ! > Any way to create a press effect on a canvas ? > The goal of a gradient theme is to minimize http calls to PNG files and to > reduce the project weight. > Would a canvas approach be lighter than 2x 4kb PNG ? I assume so but i'd > like your though. > > Even with backbutton as a PNG, this gradient theme is here already 3 times > lighter than the default one (see http://cl.ly/01294601bfcd7d5e1c1e) > > R. > > Le 31 juil. 2010 à 01:22, Jordan Dobson a écrit : > > > The one downside I found when using Canvas for buttons is that you > > have resolution issues with the Retina display since it has a > > different resolution. However a CSS approach works quite well with > > Retina Display. > > > > So if the goal is to have something flexible, we'd need to include a > > hi-res canvas button option for Retina Displays. > > > > Here's my first Canvas attempt: > > > > http://jordandobson.com/demo/jqtouch/canvas_buttons.html > > > > I'll put up my CSS only solution later today... then we can hopefully > > start to pick it apart and improve the approach. > > > > Most of these are experiments and I expect them to need refinements. > > > > - Jordan > > > > On Thu, Jul 29, 2010 at 4:10 PM, Sean Gilligan <[email protected]> > wrote: > >> On 7/29/10 2:47 PM, Alex Zylka wrote: > >>> > >>> Sounds cool. Do you have an on-line demo? > >> > >> I do! It's here: http://www.zylka.us/btn_demo/ > >> And I will probably implement the svg backButton image into it (my demo) > >> soon. Thanks for bringing that to my attention. > >> > >> As Remi notes, SVG will not work on Android and perhaps on other > platforms. > >> There may be a way of using SVG and then falling back if it's not > supported > >> (I think I've seen a technique for doing this) Another possibility is > using > >> Canvas (and the SVG image might help you generate JavaScript that works > with > >> canvas) There are other imageless CSS techniques that I've heard people > >> talk about as well. One cool thing you can do with these approaches is > make > >> it really easy to change the color of the theme. > >> > >> There is more than one way to skin this cat and we can host multiple > >> approaches in the iUI repository. We'll see which techniques can make > it > >> through beta testing... > >> > >> -- Sean > >> > >> -- > >> You received this message because you are subscribed to the Google > Groups > >> "iPhoneWebDev" group. > >> To post to this group, send email to [email protected]. > >> To unsubscribe from this group, send email to > >> [email protected]<iphonewebdev%[email protected]> > . > >> For more options, visit this group at > >> http://groups.google.com/group/iphonewebdev?hl=en. > >> > > > > > > > > -- > > Jordan Dobson > > Owner + Director > > MadeBySquad.com | Glue.Pro | SquadBlog.com > > (425) 444-8014 > > > > Follow me on twitter at http://Twitter.com/JordanDobson > > > > -- > > You received this message because you are subscribed to the Google Groups > "iPhoneWebDev" group. > > To post to this group, send email to [email protected]. > > To unsubscribe from this group, send email to > [email protected]<iphonewebdev%[email protected]> > . > > For more options, visit this group at > http://groups.google.com/group/iphonewebdev?hl=en. > > > > -- > You received this message because you are subscribed to the Google Groups > "iPhoneWebDev" group. > To post to this group, send email to [email protected]. > To unsubscribe from this group, send email to > [email protected]<iphonewebdev%[email protected]> > . > For more options, visit this group at > http://groups.google.com/group/iphonewebdev?hl=en. > > -- Jordan Dobson Owner + Director MadeBySquad.com | Glue.Pro | SquadBlog.com (425) 444-8014 Follow me on twitter at http://Twitter.com/JordanDobson -- You received this message because you are subscribed to the Google Groups "iPhoneWebDev" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/iphonewebdev?hl=en.
