I see strange flicker when NG clips mounted on the extended buttons I have NG-clip is shown, which is enhanced buttons / Hidden when attached to the divisive box, because the user moves the mouse to the button, this flicker? I'm it allows some to do with dealing with the incident between Zeroclipboard and angular code
Here is a Plunker page displaying problems:
Code Plunker:
& lt ;; Doctype html & gt; & Lt; Html & gt; & Lt; Top & gt; & Lt; Link href = "// netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel = "stylesheet" & gt; & Lt; Script src = "// cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.14/angular.min.js"></script> & Lt; Script src = "// cdnjs.cloudflare.com/ajax/libs/zeroclipboard/2.1.6/ZeroClipboard.min.js"></script> & Lt; Script src = "// rawgit.com/asafdav/ng-clip/master/src/ngClip.js"></script> & Lt; / Head & gt; & Lt; Body & gt; & Lt; Div ng-app = "myapp" & gt; & Lt; Div class = "container" ng-controller = "micrrl" ng-mouseover = "hahoeing = true" ng-moutout = "hahoeing = fotl" & gt; & Lt; Div class = "page-header" & gt; & Lt; H1 & gt; NgClip & lt; Small & gt; Example & lt; / Small> & Lt; / H1> & Lt; / Div & gt; & Lt; Form & gt; & Lt; Div style = "background: red;" Class = "form group" & gt; & Lt; Label & gt; Copy # 1 & lt; / Labels & gt; & Lt; Input type = "text" class = "form-control" placeholder = "enter text to copy" ng-model = "copy1" & gt; & Lt; Button ng-if = "hohoing" class = "btn btn-default" clip-copy = "copy 1" & gt; Copy! & Lt; / Button & gt; & Lt; / Div & gt; & Lt; Br / & gt; & Lt; Br / & gt; & Lt; Br / & gt; & Lt; Textarea class = "form-control" rows = "3" placeholder = "paste here" & gt; & Lt; / Textarea & gt; & Lt; / Form & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Script & gt; Var myapp = angular.module ('myapp', ["ngClipboard"]); myapp.config ([ 'ngClipProvider', function (ngClipProvider) {ngClipProvider.setPath ( "// cdnjs.cloudflare.com/ajax/libs/zeroclipboard/2.1.6/ZeroClipboard.swf"); ngClipProvider.setConfig ({bubbleEvents: false }) }]); myapp.controller ( 'myctrl', function ($ scope) {$ scope.fallback = function (copy) {window.prompt ( 'press Cmd + C to copy the text below.', CC);}; $ scope .showMessage = function () {console.log ("clip-click works!");};}); & Lt; / Script & gt; & Lt; / Body & gt; & Lt; / Html & gt;
I also had this problem. Instead of using ng-mouseover and ng-mouselevel, I have decided to use ng-mouseenter on ng-mouseover that on an internal device instead of ng-mouseout No flicker
then:
& lt; Div ng-app = "myApp" ng-mouseenter = "isHovering = true" & gt; & Lt; Div class = "container" ng-controller = "mactal" ng-mouseleave = "hashoin = fottal" & gt; & Lt; Div class = "page-header" & gt; & Lt; H1 & gt; NgClip & lt; Small & gt; Example & lt; / Small> & Lt; / H1> & Lt; / Div & gt; & Lt; Form & gt; & Lt; Div style = "background: red;" Class = "form group" & gt; & Lt; Label & gt; Copy # 1 & lt; / Labels & gt; & Lt; Input type = "text" class = "form-control" placeholder = "enter text to copy" ng-model = "copy1" & gt; & Lt; Button ng-if = "hohoing" class = "btn btn-default" clip-copy = "copy 1" & gt; Copy! & Lt; / Button & gt; & Lt; / Div & gt; & Lt; Br / & gt; & Lt; Br / & gt; & Lt; Br / & gt; & Lt; Textarea class = "form-control" rows = "3" placeholder = "paste here" & gt; & Lt; / Textarea & gt; & Lt; / Form & gt; & Lt; / Div & gt; & Lt; / Div & gt;
No comments:
Post a Comment