[webkit-help] Problem with visual feedback on editable element.

Ryosuke Niwa rniwa at webkit.org
Mon Aug 22 09:33:26 PDT 2011


You need to set the focus on the editable element to show the "focus ring"
as in:

    $(".code").click(function(ev) {
         ev.stopPropagation()
         var id = ev.currentTarget.id;
         $(".code").removeClass("editing");
         $("#" +id).addClass("editing");
         $("#" +id).focus();
    })
- Ryosuke

On Mon, Aug 22, 2011 at 3:37 AM, Stéphane Payrard <cognominal at gmail.com>wrote:

> This is resent because my first post (otherwise identical to this one)
> was apparently not
> approved by the moderator
>
>
> https://gist.github.com/1145514
> this is a html file which demonstrates a problem with visual feedback
> on editable element. Can someone help?
>
> I want to edit an  element make editable if I click on it.
> Elements of class "editing" are editable as per the css.
> Clicking an element of class code  makes it editable.
> Typing escape makes the englobing element editable.
>
> Everything works fine except that the blue box indicating
> the editable area does not appear until I move the caret with
> a left or right arrow
>
> This is on chrome.
> Note the reliance on this inline css.
>
> .editing {
>    -webkit-user-select: text;
>    -webkit-user-modify: read-write;
>  }
>
> jquery is used to clear and set the "editing" class for the right element
>
> Is there a work around?
>
> --
> cognominal stef
>
>
>
> --
> cognominal stef
> _______________________________________________
> webkit-help mailing list
> webkit-help at lists.webkit.org
> http://lists.webkit.org/mailman/listinfo.cgi/webkit-help
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-help/attachments/20110822/eeb776bc/attachment.html>


More information about the webkit-help mailing list