recentpopularlog in

kme : animation   138

« earlier  
Disable Dock Bouncing in Mac OS X
<code class="language-bash">defaults write com.apple.dock no-bouncing -bool TRUE</code>
macos  defaults  solution  dock  animation  movein 
september 2019 by kme
Disable the New Window Animation in Mac OS X
<code class="language-bash">defaults write NSGlobalDomain NSAutomaticWindowAnimationsEnabled -bool NO</code>
window  animation  dialogbox  defaults  movein  essential  macos  mojave  10.14  solution 
september 2019 by kme
css3 - How can I transition height: 0; to height: auto; using CSS? - Stack Overflow
Use max-height in the transformation and not height. And set a value on max-height to something bigger than your box will ever get.
css  animation  css3  transitions  webdesign  dammitbrain  solution 
june 2019 by kme
Animated images - MozillaZine Knowledge Base | http://kb.mozillazine.org/
Pressing the "Esc" key on Windows (other OS may be different) will pause animated images on the current website. Note: Starting in Firefox 20, this is no longer the case due to the fix for bug 614304 unless resolved in an upcoming patch (see comment 45). The SuperStop add-on by Gavin Sharp (https://addons.mozilla.org/en-US/firefox/addon/superstop/) is an alternate solution.
firefox  gif  animation  annoyance  solution 
march 2019 by kme
javascript - How to position loading animation inside input box? - Stack Overflow | https://stackoverflow.com/
You can also do it as a background image in CSS. Just create a CSS class and apply at the time of loading the data. After Ajax call is completed remove the "loading" CSS class from the text input box.<code class="language-css">
.loading {
background-color: #ffffff;
background-image: url("http://loadinggif.com/images/image-selection/3.gif");
background-size: 25px 25px;
background-position:right center;
background-repeat: no-repeat;
}</code>
webdesign  webdevel  css  animation  animatedgif  solution 
october 2018 by kme
javascript - Smooth scroll to specific div on click - Stack Overflow

$("button").click(function() {
$('html,body').animate({
scrollTop: $(".second").offset().top},
'slow');
});
jquery  javascript  html  webdevel  animation  solution 
june 2017 by kme
State of the Animation with Rachel Nabors @ SFHTML5 - YouTube
Researchers for operating systems, uh, working on operating systems back in the 90s found that we can speed up a person's, a user's, mental processing by offloading their interpolation of two states to their visual cortex--basically it's the brain's GPU. So that they can have two tasks running on the brain at the same time.

They don't have to stop and think about where they've come from and where they're going if you animate all of that for them.
animation  video  html5  webdesign  interactiondesign  ui  ux  webdevel  css 
july 2016 by kme
JavaScript: Fade a Element Using CSS Transition
<code class="language-javascript">var star = document.getElementById("id66259");
star.style.opacity = 1;
star.style.transition = "opacity 1s";
var button1 = document.getElementById("b1");
var button2 = document.getElementById("b2");

function fade() {
star.style.opacity = 0;
}

function unfade() {
star.style.opacity = 1;
}
button1.addEventListener("click", fade, false);
button2.addEventListener("click", unfade, false);</code>
javascript  css  animation  webdevel  webdesign  solution 
august 2015 by kme
How to hide and show initial content, depending on whether JavaScript support is available - Robert's talk [http://robertnyman.com/]
An external stylesheet actually isn't necessary. You can create all the styles in a <style> tag and head.appendChild() that instead.

<code class="language-js">(function () {
var head = document.getElementsByTagName("head")[0];
if (head) {
var scriptStyles = document.createElement("link");
scriptStyles.rel = "stylesheet";
scriptStyles.type = "text/css";
scriptStyles.href = "script-styles.css";
head.appendChild(scriptStyles);
}
}());</code>
jquery  css  javascript  elementhiding  animation  solution 
april 2015 by kme
Animating from “display: block” to “display: none” | Impressive Webs
Kind of works, but so does animating on 'visible';

<code class="language-css">.box {
transition: opacity 2s linear;
transform:translate(0);
opacity: 1;
}
.hidden {
transform:translate(9999px);
opacity: 0;
}</code>
css  animation  transition  messagebox  ui  webdesign  webdwevel  solution 
january 2015 by kme
« earlier      
per page:    204080120160

Copy this bookmark:





to read