Are you over 18 and want to see adult content?
More Annotations
A complete backup of premioinnovare.com.br
Are you over 18 and want to see adult content?
A complete backup of dhconsultores.com
Are you over 18 and want to see adult content?
A complete backup of entirecannabis.cc
Are you over 18 and want to see adult content?
A complete backup of aureliano276.tumblr.com
Are you over 18 and want to see adult content?
Favourite Annotations
A complete backup of katana-sport.com
Are you over 18 and want to see adult content?
A complete backup of newsgeneration.com
Are you over 18 and want to see adult content?
A complete backup of worldwidemedias.com
Are you over 18 and want to see adult content?
A complete backup of librarianbyday.net
Are you over 18 and want to see adult content?
A complete backup of agentschapszw.nl
Are you over 18 and want to see adult content?
A complete backup of juliedaniluk.com
Are you over 18 and want to see adult content?
A complete backup of terafoundation.org
Are you over 18 and want to see adult content?
Text
HOME - MATTHEW LEIN
©2021 Matthew Lein
WORK - MATTHEW LEIN
Red Stamp. I worked with Red Stamp on a full rewrite of their frontend, SPA rewrite of the web card editor, along with a lot of backend and API work. Send Your Mom a Card ». Next project. AmericansElect.
TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011.EXPERIMENTS
An adventure in Object Oriented JavaScript, animating with , and a thorough exploration of the Ball. Published Oct 13, 2010. CEASER - CSS EASING ANIMATION TOOL - MATTHEW LEIN Ceaser CSS Easing Animation Tool. Ceaser. Choose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make them pretty.JQUERY WIDOWFIX
20-SIDED DIE
At time of creation Webkit was the only implementor of 3D transforms. HTML5 D&D anyone? I was inspired by Desandro’s excellent 3D transforms article and wanted to make sure that I “got it.”. I had the idea of the 20-Sided Die and rolled with it, for better or worse. Published Feb 22, 2011.RAINBOW TEXT-SHADOW
A random experiment to see if I could use text shadow to create a shifting rainbow. I built a jQuery version and a normal JavaScript version, and as you may expect, introducing the jQuery object into the process slowed things down quite a bit, considering how little I used it. Good lesson in using jQuery only when needed. JQUERY EASING EXAMPLES Effect Duration (in milliseconds): Power User Tip: Use the Left and Right arrow keys to cycle betwen easing types, and use Enter/Return to test and retest.. Where did fadeToggle() come from?JQUERY JSLOTS
Options. These are the options, with their default values, and what they do. $.jSlots.defaultOptions = { number : 3, // Number: number of slots winnerNumber : 1, // Number or Array: list item number (s) upon which to trigger a win, 1-based index, NOT ZERO-BASED spinner : '', // CSS Selector: element to bind the start event to spinEvent : 'clickHOME - MATTHEW LEIN
©2021 Matthew Lein
WORK - MATTHEW LEIN
Red Stamp. I worked with Red Stamp on a full rewrite of their frontend, SPA rewrite of the web card editor, along with a lot of backend and API work. Send Your Mom a Card ». Next project. AmericansElect.
TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011.EXPERIMENTS
An adventure in Object Oriented JavaScript, animating with , and a thorough exploration of the Ball. Published Oct 13, 2010. CEASER - CSS EASING ANIMATION TOOL - MATTHEW LEIN Ceaser CSS Easing Animation Tool. Ceaser. Choose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make them pretty.JQUERY WIDOWFIX
20-SIDED DIE
At time of creation Webkit was the only implementor of 3D transforms. HTML5 D&D anyone? I was inspired by Desandro’s excellent 3D transforms article and wanted to make sure that I “got it.”. I had the idea of the 20-Sided Die and rolled with it, for better or worse. Published Feb 22, 2011.RAINBOW TEXT-SHADOW
A random experiment to see if I could use text shadow to create a shifting rainbow. I built a jQuery version and a normal JavaScript version, and as you may expect, introducing the jQuery object into the process slowed things down quite a bit, considering how little I used it. Good lesson in using jQuery only when needed. JQUERY EASING EXAMPLES Effect Duration (in milliseconds): Power User Tip: Use the Left and Right arrow keys to cycle betwen easing types, and use Enter/Return to test and retest.. Where did fadeToggle() come from?JQUERY JSLOTS
Options. These are the options, with their default values, and what they do. $.jSlots.defaultOptions = { number : 3, // Number: number of slots winnerNumber : 1, // Number or Array: list item number (s) upon which to trigger a win, 1-based index, NOT ZERO-BASED spinner : '', // CSS Selector: element to bind the start event to spinEvent : 'click ABOUT - MATTHEW LEIN For the last few years I’ve also been doing fullstack development. I live in Minneapolis/St. Paul, MN. I’m currently doing contract/consulting work and spending some time on my own projects. If you want to work with me, please email me at matt@matthewlein.com. Outside of web work, I love to travel! I’ve visited 21 countries sofar, and am
EXPERIMENTS
Orbular.js . A fun little canvas bauble with spinning orbs. Published Mar 26, 2012 jQuery ViewMaster . A slideshow demo I put together to try out some jQuery manipulation of ARTICLES - MATTHEW LEIN How to install jemalloc on AWS Elastic Beanstalk . jemalloc is memory magic, but not so easily installed on Elastic Beanstalk . Published Feb 27, 2021 Another way toAMERICANS ELECT
Americans Elect. Yellowsmith. Waggin’ Train. Ceaser. Patternizer. Loopalo. WompWompWomp. I was the front-end lead for this ambitious political project, and the results were incredible! Hundreds of thousands of users joined to vote for their next presidentialcandidate.
CEASER - MATTHEW LEIN Ceaser. Ceaser is an interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Much to my delight, it is now used by thousands of developers around the world, AND the easing values3D CSS MENU
3D CSS Menu. I’m Flipping Out! I’m Flipping Out! After trying to make the arrow with :after, I learned that you can’t transition pseudo elements. Disappointing, yes, but my big discovery was that from the :target demos I’ve seen, no one mentions that the page will scroll to the named element! Just like a named anchor. Of course itdoes
BEARD PAINTER
Beard Painter. Beard Brush Eraser Clear Brush Size: 10. facial-hair manipulation. I’m sure someone is spinning in their proverbial grave today. I ran through a bunch of ideas on getting the brush to paint in a circle, but all of them failed. If anyone has any ideas, please let me know. Also adding semi-transparency into it revealed20-SIDED DIE
At time of creation Webkit was the only implementor of 3D transforms. HTML5 D&D anyone? I was inspired by Desandro’s excellent 3D transforms article and wanted to make sure that I “got it.”. I had the idea of the 20-Sided Die and rolled with it, for better or worse. Published Feb 22, 2011. BUSTIFY.JS - MATTHEW LEIN Previous Experiment: 20-Sided Die . Next Experiment: JS1K Xmas 2010Submission
BALLS 2: STICKY MOUSE The balls now stick to the cursor. I reworked and improved the balls code a bit to make it technically better with prototypes. It’s kind fun to let them all collect in one spot, then let them loose.HOME - MATTHEW LEIN
©2021 Matthew Lein
WORK - MATTHEW LEIN
Red Stamp. I worked with Red Stamp on a full rewrite of their frontend, SPA rewrite of the web card editor, along with a lot of backend and API work. Send Your Mom a Card ». Next project. AmericansElect.
TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011.EXPERIMENTS
An adventure in Object Oriented JavaScript, animating with , and a thorough exploration of the Ball. Published Oct 13, 2010. CEASER - CSS EASING ANIMATION TOOL - MATTHEW LEIN Ceaser CSS Easing Animation Tool. Ceaser. Choose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make them pretty.JQUERY WIDOWFIX
20-SIDED DIE
At time of creation Webkit was the only implementor of 3D transforms. HTML5 D&D anyone? I was inspired by Desandro’s excellent 3D transforms article and wanted to make sure that I “got it.”. I had the idea of the 20-Sided Die and rolled with it, for better or worse. Published Feb 22, 2011.RAINBOW TEXT-SHADOW
A random experiment to see if I could use text shadow to create a shifting rainbow. I built a jQuery version and a normal JavaScript version, and as you may expect, introducing the jQuery object into the process slowed things down quite a bit, considering how little I used it. Good lesson in using jQuery only when needed. JQUERY EASING EXAMPLES Effect Duration (in milliseconds): Power User Tip: Use the Left and Right arrow keys to cycle betwen easing types, and use Enter/Return to test and retest.. Where did fadeToggle() come from?JQUERY JSLOTS
Options. These are the options, with their default values, and what they do. $.jSlots.defaultOptions = { number : 3, // Number: number of slots winnerNumber : 1, // Number or Array: list item number (s) upon which to trigger a win, 1-based index, NOT ZERO-BASED spinner : '', // CSS Selector: element to bind the start event to spinEvent : 'clickHOME - MATTHEW LEIN
©2021 Matthew Lein
WORK - MATTHEW LEIN
Red Stamp. I worked with Red Stamp on a full rewrite of their frontend, SPA rewrite of the web card editor, along with a lot of backend and API work. Send Your Mom a Card ». Next project. AmericansElect.
TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011.EXPERIMENTS
An adventure in Object Oriented JavaScript, animating with , and a thorough exploration of the Ball. Published Oct 13, 2010. CEASER - CSS EASING ANIMATION TOOL - MATTHEW LEIN Ceaser CSS Easing Animation Tool. Ceaser. Choose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make them pretty.JQUERY WIDOWFIX
20-SIDED DIE
At time of creation Webkit was the only implementor of 3D transforms. HTML5 D&D anyone? I was inspired by Desandro’s excellent 3D transforms article and wanted to make sure that I “got it.”. I had the idea of the 20-Sided Die and rolled with it, for better or worse. Published Feb 22, 2011.RAINBOW TEXT-SHADOW
A random experiment to see if I could use text shadow to create a shifting rainbow. I built a jQuery version and a normal JavaScript version, and as you may expect, introducing the jQuery object into the process slowed things down quite a bit, considering how little I used it. Good lesson in using jQuery only when needed. JQUERY EASING EXAMPLES Effect Duration (in milliseconds): Power User Tip: Use the Left and Right arrow keys to cycle betwen easing types, and use Enter/Return to test and retest.. Where did fadeToggle() come from?JQUERY JSLOTS
Options. These are the options, with their default values, and what they do. $.jSlots.defaultOptions = { number : 3, // Number: number of slots winnerNumber : 1, // Number or Array: list item number (s) upon which to trigger a win, 1-based index, NOT ZERO-BASED spinner : '', // CSS Selector: element to bind the start event to spinEvent : 'click ABOUT - MATTHEW LEIN For the last few years I’ve also been doing fullstack development. I live in Minneapolis/St. Paul, MN. I’m currently doing contract/consulting work and spending some time on my own projects. If you want to work with me, please email me at matt@matthewlein.com. Outside of web work, I love to travel! I’ve visited 21 countries sofar, and am
ARTICLES - MATTHEW LEIN How to install jemalloc on AWS Elastic Beanstalk . jemalloc is memory magic, but not so easily installed on Elastic Beanstalk . Published Feb 27, 2021 Another way toEXPERIMENTS
Orbular.js . A fun little canvas bauble with spinning orbs. Published Mar 26, 2012 jQuery ViewMaster . A slideshow demo I put together to try out some jQuery manipulation of CEASER - MATTHEW LEIN Ceaser. Ceaser is an interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Much to my delight, it is now used by thousands of developers around the world, AND the easing valuesBEARD PAINTER
Beard Painter. Beard Brush Eraser Clear Brush Size: 10. facial-hair manipulation. I’m sure someone is spinning in their proverbial grave today. I ran through a bunch of ideas on getting the brush to paint in a circle, but all of them failed. If anyone has any ideas, please let me know. Also adding semi-transparency into it revealed3D CSS MENU
3D CSS Menu. I’m Flipping Out! I’m Flipping Out! After trying to make the arrow with :after, I learned that you can’t transition pseudo elements. Disappointing, yes, but my big discovery was that from the :target demos I’ve seen, no one mentions that the page will scroll to the named element! Just like a named anchor. Of course itdoes
ORBULAR.JS - MATTHEW LEIN Orbular.js. A fun little canvas bauble. I tried out the dat.GUI controller, which is amazing. I like to put on music and play with the controls in sync with the beat. Next step for me is to turn this into a real audio visualizer. The url is updated with your settings so you can share if you want. Try these for fun: Move anything to min and max20-SIDED DIE
At time of creation Webkit was the only implementor of 3D transforms. HTML5 D&D anyone? I was inspired by Desandro’s excellent 3D transforms article and wanted to make sure that I “got it.”. I had the idea of the 20-Sided Die and rolled with it, for better or worse. Published Feb 22, 2011. BUSTIFY.JS - MATTHEW LEIN Previous Experiment: 20-Sided Die . Next Experiment: JS1K Xmas 2010Submission
BALLS 2: STICKY MOUSE The balls now stick to the cursor. I reworked and improved the balls code a bit to make it technically better with prototypes. It’s kind fun to let them all collect in one spot, then let them loose.HOME - MATTHEW LEIN
©2021 Matthew Lein
WORK - MATTHEW LEIN
Red Stamp. I worked with Red Stamp on a full rewrite of their frontend, SPA rewrite of the web card editor, along with a lot of backend and API work. Send Your Mom a Card ». Next project. AmericansElect.
TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011.EXPERIMENTS
An adventure in Object Oriented JavaScript, animating with , and a thorough exploration of the Ball. Published Oct 13, 2010. CEASER - CSS EASING ANIMATION TOOL - MATTHEW LEIN Ceaser CSS Easing Animation Tool. Ceaser. Choose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make them pretty.JQUERY WIDOWFIX
RAINBOW TEXT-SHADOW
A random experiment to see if I could use text shadow to create a shifting rainbow. I built a jQuery version and a normal JavaScript version, and as you may expect, introducing the jQuery object into the process slowed things down quite a bit, considering how little I used it. Good lesson in using jQuery only when needed. JQUERY EASING EXAMPLES Effect Duration (in milliseconds): Power User Tip: Use the Left and Right arrow keys to cycle betwen easing types, and use Enter/Return to test and retest.. Where did fadeToggle() come from?YELLOWSMITH
Yellowsmith. I lead the front-end efforts of a complete rebuild/rebranding, moving to a fully responsive mobile-first layout. After the rebuild, we saw a ~350% load time reduction! (including added support for mobile and lap devices!) I also took the opportunity to modernize the front-end stack using SASS, RequireJS, icon fonts,and a BEM-style
JQUERY JSLOTS
Options. These are the options, with their default values, and what they do. $.jSlots.defaultOptions = { number : 3, // Number: number of slots winnerNumber : 1, // Number or Array: list item number (s) upon which to trigger a win, 1-based index, NOT ZERO-BASED spinner : '', // CSS Selector: element to bind the start event to spinEvent : 'clickHOME - MATTHEW LEIN
©2021 Matthew Lein
WORK - MATTHEW LEIN
Red Stamp. I worked with Red Stamp on a full rewrite of their frontend, SPA rewrite of the web card editor, along with a lot of backend and API work. Send Your Mom a Card ». Next project. AmericansElect.
TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011.EXPERIMENTS
An adventure in Object Oriented JavaScript, animating with , and a thorough exploration of the Ball. Published Oct 13, 2010. CEASER - CSS EASING ANIMATION TOOL - MATTHEW LEIN Ceaser CSS Easing Animation Tool. Ceaser. Choose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make them pretty.JQUERY WIDOWFIX
RAINBOW TEXT-SHADOW
A random experiment to see if I could use text shadow to create a shifting rainbow. I built a jQuery version and a normal JavaScript version, and as you may expect, introducing the jQuery object into the process slowed things down quite a bit, considering how little I used it. Good lesson in using jQuery only when needed. JQUERY EASING EXAMPLES Effect Duration (in milliseconds): Power User Tip: Use the Left and Right arrow keys to cycle betwen easing types, and use Enter/Return to test and retest.. Where did fadeToggle() come from?YELLOWSMITH
Yellowsmith. I lead the front-end efforts of a complete rebuild/rebranding, moving to a fully responsive mobile-first layout. After the rebuild, we saw a ~350% load time reduction! (including added support for mobile and lap devices!) I also took the opportunity to modernize the front-end stack using SASS, RequireJS, icon fonts,and a BEM-style
JQUERY JSLOTS
Options. These are the options, with their default values, and what they do. $.jSlots.defaultOptions = { number : 3, // Number: number of slots winnerNumber : 1, // Number or Array: list item number (s) upon which to trigger a win, 1-based index, NOT ZERO-BASED spinner : '', // CSS Selector: element to bind the start event to spinEvent : 'click TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011. ABOUT - MATTHEW LEIN For the last few years I’ve also been doing fullstack development. I live in Minneapolis/St. Paul, MN. I’m currently doing contract/consulting work and spending some time on my own projects. If you want to work with me, please email me at matt@matthewlein.com. Outside of web work, I love to travel! I’ve visited 21 countries sofar, and am
EXPERIMENTS
Orbular.js . A fun little canvas bauble with spinning orbs. Published Mar 26, 2012 jQuery ViewMaster . A slideshow demo I put together to try out some jQuery manipulation of ARTICLES - MATTHEW LEIN How to install jemalloc on AWS Elastic Beanstalk . jemalloc is memory magic, but not so easily installed on Elastic Beanstalk . Published Feb 27, 2021 Another way to CEASER - MATTHEW LEIN Ceaser. Ceaser is an interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Much to my delight, it is now used by thousands of developers around the world, AND the easing valuesBEARD PAINTER
Beard Painter. Beard Brush Eraser Clear Brush Size: 10. facial-hair manipulation. I’m sure someone is spinning in their proverbial grave today. I ran through a bunch of ideas on getting the brush to paint in a circle, but all of them failed. If anyone has any ideas, please let me know. Also adding semi-transparency into it revealed3D CSS MENU
3D CSS Menu. I’m Flipping Out! I’m Flipping Out! After trying to make the arrow with :after, I learned that you can’t transition pseudo elements. Disappointing, yes, but my big discovery was that from the :target demos I’ve seen, no one mentions that the page will scroll to the named element! Just like a named anchor. Of course itdoes
20-SIDED DIE
At time of creation Webkit was the only implementor of 3D transforms. HTML5 D&D anyone? I was inspired by Desandro’s excellent 3D transforms article and wanted to make sure that I “got it.”. I had the idea of the 20-Sided Die and rolled with it, for better or worse. Published Feb 22, 2011. ORBULAR.JS - MATTHEW LEIN Orbular.js. A fun little canvas bauble. I tried out the dat.GUI controller, which is amazing. I like to put on music and play with the controls in sync with the beat. Next step for me is to turn this into a real audio visualizer. The url is updated with your settings so you can share if you want. Try these for fun: Move anything to min and max BALLS 2: STICKY MOUSE The balls now stick to the cursor. I reworked and improved the balls code a bit to make it technically better with prototypes. It’s kind fun to let them all collect in one spot, then let them loose.HOME - MATTHEW LEIN
©2021 Matthew Lein
WORK - MATTHEW LEIN
Red Stamp. I worked with Red Stamp on a full rewrite of their frontend, SPA rewrite of the web card editor, along with a lot of backend and API work. Send Your Mom a Card ». Next project. AmericansElect.
TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011.EXPERIMENTS
An adventure in Object Oriented JavaScript, animating with , and a thorough exploration of the Ball. Published Oct 13, 2010. CEASER - CSS EASING ANIMATION TOOL - MATTHEW LEIN Ceaser CSS Easing Animation Tool. Ceaser. Choose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make them pretty.JQUERY WIDOWFIX
RAINBOW TEXT-SHADOW
A random experiment to see if I could use text shadow to create a shifting rainbow. I built a jQuery version and a normal JavaScript version, and as you may expect, introducing the jQuery object into the process slowed things down quite a bit, considering how little I used it. Good lesson in using jQuery only when needed. JQUERY EASING EXAMPLES Effect Duration (in milliseconds): Power User Tip: Use the Left and Right arrow keys to cycle betwen easing types, and use Enter/Return to test and retest.. Where did fadeToggle() come from?YELLOWSMITH
Yellowsmith. I lead the front-end efforts of a complete rebuild/rebranding, moving to a fully responsive mobile-first layout. After the rebuild, we saw a ~350% load time reduction! (including added support for mobile and lap devices!) I also took the opportunity to modernize the front-end stack using SASS, RequireJS, icon fonts,and a BEM-style
JQUERY JSLOTS
Options. These are the options, with their default values, and what they do. $.jSlots.defaultOptions = { number : 3, // Number: number of slots winnerNumber : 1, // Number or Array: list item number (s) upon which to trigger a win, 1-based index, NOT ZERO-BASED spinner : '', // CSS Selector: element to bind the start event to spinEvent : 'clickHOME - MATTHEW LEIN
©2021 Matthew Lein
WORK - MATTHEW LEIN
Red Stamp. I worked with Red Stamp on a full rewrite of their frontend, SPA rewrite of the web card editor, along with a lot of backend and API work. Send Your Mom a Card ». Next project. AmericansElect.
TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011.EXPERIMENTS
An adventure in Object Oriented JavaScript, animating with , and a thorough exploration of the Ball. Published Oct 13, 2010. CEASER - CSS EASING ANIMATION TOOL - MATTHEW LEIN Ceaser CSS Easing Animation Tool. Ceaser. Choose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make them pretty.JQUERY WIDOWFIX
RAINBOW TEXT-SHADOW
A random experiment to see if I could use text shadow to create a shifting rainbow. I built a jQuery version and a normal JavaScript version, and as you may expect, introducing the jQuery object into the process slowed things down quite a bit, considering how little I used it. Good lesson in using jQuery only when needed. JQUERY EASING EXAMPLES Effect Duration (in milliseconds): Power User Tip: Use the Left and Right arrow keys to cycle betwen easing types, and use Enter/Return to test and retest.. Where did fadeToggle() come from?YELLOWSMITH
Yellowsmith. I lead the front-end efforts of a complete rebuild/rebranding, moving to a fully responsive mobile-first layout. After the rebuild, we saw a ~350% load time reduction! (including added support for mobile and lap devices!) I also took the opportunity to modernize the front-end stack using SASS, RequireJS, icon fonts,and a BEM-style
JQUERY JSLOTS
Options. These are the options, with their default values, and what they do. $.jSlots.defaultOptions = { number : 3, // Number: number of slots winnerNumber : 1, // Number or Array: list item number (s) upon which to trigger a win, 1-based index, NOT ZERO-BASED spinner : '', // CSS Selector: element to bind the start event to spinEvent : 'click TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011. ABOUT - MATTHEW LEIN For the last few years I’ve also been doing fullstack development. I live in Minneapolis/St. Paul, MN. I’m currently doing contract/consulting work and spending some time on my own projects. If you want to work with me, please email me at matt@matthewlein.com. Outside of web work, I love to travel! I’ve visited 21 countries sofar, and am
EXPERIMENTS
Orbular.js . A fun little canvas bauble with spinning orbs. Published Mar 26, 2012 jQuery ViewMaster . A slideshow demo I put together to try out some jQuery manipulation of ARTICLES - MATTHEW LEIN How to install jemalloc on AWS Elastic Beanstalk . jemalloc is memory magic, but not so easily installed on Elastic Beanstalk . Published Feb 27, 2021 Another way to CEASER - MATTHEW LEIN Ceaser. Ceaser is an interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Much to my delight, it is now used by thousands of developers around the world, AND the easing valuesBEARD PAINTER
Beard Painter. Beard Brush Eraser Clear Brush Size: 10. facial-hair manipulation. I’m sure someone is spinning in their proverbial grave today. I ran through a bunch of ideas on getting the brush to paint in a circle, but all of them failed. If anyone has any ideas, please let me know. Also adding semi-transparency into it revealed3D CSS MENU
3D CSS Menu. I’m Flipping Out! I’m Flipping Out! After trying to make the arrow with :after, I learned that you can’t transition pseudo elements. Disappointing, yes, but my big discovery was that from the :target demos I’ve seen, no one mentions that the page will scroll to the named element! Just like a named anchor. Of course itdoes
20-SIDED DIE
At time of creation Webkit was the only implementor of 3D transforms. HTML5 D&D anyone? I was inspired by Desandro’s excellent 3D transforms article and wanted to make sure that I “got it.”. I had the idea of the 20-Sided Die and rolled with it, for better or worse. Published Feb 22, 2011. ORBULAR.JS - MATTHEW LEIN Orbular.js. A fun little canvas bauble. I tried out the dat.GUI controller, which is amazing. I like to put on music and play with the controls in sync with the beat. Next step for me is to turn this into a real audio visualizer. The url is updated with your settings so you can share if you want. Try these for fun: Move anything to min and max BALLS 2: STICKY MOUSE The balls now stick to the cursor. I reworked and improved the balls code a bit to make it technically better with prototypes. It’s kind fun to let them all collect in one spot, then let them loose.WORK - MATTHEW LEIN
Red Stamp. I worked with Red Stamp on a full rewrite of their frontend, SPA rewrite of the web card editor, along with a lot of backend and API work. Send Your Mom a Card ». Next project. AmericansElect.
TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011.EXPERIMENTS
An adventure in Object Oriented JavaScript, animating with , and a thorough exploration of the Ball. Published Oct 13, 2010. CEASER - CSS EASING ANIMATION TOOL - MATTHEW LEIN Ceaser CSS Easing Animation Tool. Ceaser. Choose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make them pretty.JQUERY WIDOWFIX
BEARD PAINTER
Beard Painter. Beard Brush Eraser Clear Brush Size: 10. facial-hair manipulation. I’m sure someone is spinning in their proverbial grave today. I ran through a bunch of ideas on getting the brush to paint in a circle, but all of them failed. If anyone has any ideas, please let me know. Also adding semi-transparency into it revealed3D CSS MENU
3D CSS Menu. I’m Flipping Out! I’m Flipping Out! After trying to make the arrow with :after, I learned that you can’t transition pseudo elements. Disappointing, yes, but my big discovery was that from the :target demos I’ve seen, no one mentions that the page will scroll to the named element! Just like a named anchor. Of course itdoes
JQUERY JSLOTS
Options. These are the options, with their default values, and what they do. $.jSlots.defaultOptions = { number : 3, // Number: number of slots winnerNumber : 1, // Number or Array: list item number (s) upon which to trigger a win, 1-based index, NOT ZERO-BASED spinner : '', // CSS Selector: element to bind the start event to spinEvent : 'clickRAINBOW TEXT-SHADOW
A random experiment to see if I could use text shadow to create a shifting rainbow. I built a jQuery version and a normal JavaScript version, and as you may expect, introducing the jQuery object into the process slowed things down quite a bit, considering how little I used it. Good lesson in using jQuery only when needed. JQUERY EASING EXAMPLES Effect Duration (in milliseconds): Power User Tip: Use the Left and Right arrow keys to cycle betwen easing types, and use Enter/Return to test and retest.. Where did fadeToggle() come from?WORK - MATTHEW LEIN
Red Stamp. I worked with Red Stamp on a full rewrite of their frontend, SPA rewrite of the web card editor, along with a lot of backend and API work. Send Your Mom a Card ». Next project. AmericansElect.
TOOLS - MATTHEW LEIN Ceaser. An interactive CSS easing animation tool. It lets you build any kind of ease you want, and comes with many of the Penner Easing Equations. Published Mar 21, 2011.EXPERIMENTS
An adventure in Object Oriented JavaScript, animating with , and a thorough exploration of the Ball. Published Oct 13, 2010. CEASER - CSS EASING ANIMATION TOOL - MATTHEW LEIN Ceaser CSS Easing Animation Tool. Ceaser. Choose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make them pretty.JQUERY WIDOWFIX
BEARD PAINTER
Beard Painter. Beard Brush Eraser Clear Brush Size: 10. facial-hair manipulation. I’m sure someone is spinning in their proverbial grave today. I ran through a bunch of ideas on getting the brush to paint in a circle, but all of them failed. If anyone has any ideas, please let me know. Also adding semi-transparency into it revealed3D CSS MENU
3D CSS Menu. I’m Flipping Out! I’m Flipping Out! After trying to make the arrow with :after, I learned that you can’t transition pseudo elements. Disappointing, yes, but my big discovery was that from the :target demos I’ve seen, no one mentions that the page will scroll to the named element! Just like a named anchor. Of course itdoes
JQUERY JSLOTS
Options. These are the options, with their default values, and what they do. $.jSlots.defaultOptions = { number : 3, // Number: number of slots winnerNumber : 1, // Number or Array: list item number (s) upon which to trigger a win, 1-based index, NOT ZERO-BASED spinner : '', // CSS Selector: element to bind the start event to spinEvent : 'clickRAINBOW TEXT-SHADOW
A random experiment to see if I could use text shadow to create a shifting rainbow. I built a jQuery version and a normal JavaScript version, and as you may expect, introducing the jQuery object into the process slowed things down quite a bit, considering how little I used it. Good lesson in using jQuery only when needed. JQUERY EASING EXAMPLES Effect Duration (in milliseconds): Power User Tip: Use the Left and Right arrow keys to cycle betwen easing types, and use Enter/Return to test and retest.. Where did fadeToggle() come from?HOME - MATTHEW LEIN
©2021 Matthew Lein
ABOUT - MATTHEW LEIN For the last few years I’ve also been doing fullstack development. I live in Minneapolis/St. Paul, MN. I’m currently doing contract/consulting work and spending some time on my own projects. If you want to work with me, please email me at matt@matthewlein.com. Outside of web work, I love to travel! I’ve visited 21 countries sofar, and am
EXPERIMENTS
Orbular.js . A fun little canvas bauble with spinning orbs. Published Mar 26, 2012 jQuery ViewMaster . A slideshow demo I put together to try out some jQuery manipulation of ARTICLES - MATTHEW LEIN How to install jemalloc on AWS Elastic Beanstalk . jemalloc is memory magic, but not so easily installed on Elastic Beanstalk . Published Feb 27, 2021 Another way toBEARD PAINTER
Beard Painter. Beard Brush Eraser Clear Brush Size: 10. facial-hair manipulation. I’m sure someone is spinning in their proverbial grave today. I ran through a bunch of ideas on getting the brush to paint in a circle, but all of them failed. If anyone has any ideas, please let me know. Also adding semi-transparency into it revealed20-SIDED DIE
At time of creation Webkit was the only implementor of 3D transforms. HTML5 D&D anyone? I was inspired by Desandro’s excellent 3D transforms article and wanted to make sure that I “got it.”. I had the idea of the 20-Sided Die and rolled with it, for better or worse. Published Feb 22, 2011.3D CSS MENU
3D CSS Menu. I’m Flipping Out! I’m Flipping Out! After trying to make the arrow with :after, I learned that you can’t transition pseudo elements. Disappointing, yes, but my big discovery was that from the :target demos I’ve seen, no one mentions that the page will scroll to the named element! Just like a named anchor. Of course itdoes
ORBULAR.JS - MATTHEW LEIN Orbular.js. A fun little canvas bauble. I tried out the dat.GUI controller, which is amazing. I like to put on music and play with the controls in sync with the beat. Next step for me is to turn this into a real audio visualizer. The url is updated with your settings so you can share if you want. Try these for fun: Move anything to min and max BUSTIFY.JS - MATTHEW LEIN Previous Experiment: 20-Sided Die . Next Experiment: JS1K Xmas 2010Submission
YELLOWSMITH
Yellowsmith. I lead the front-end efforts of a complete rebuild/rebranding, moving to a fully responsive mobile-first layout. After the rebuild, we saw a ~350% load time reduction! (including added support for mobile and lap devices!) I also took the opportunity to modernize the front-end stack using SASS, RequireJS, icon fonts,and a BEM-style
Matthew Lein Menu
* Work
* Tools
* Experiments
* Articles
* About
©2020 Matthew Lein
Details
Copyright © 2024 ArchiveBay.com. All rights reserved. Terms of Use | Privacy Policy | DMCA | 2021 | Feedback | Advertising | RSS 2.0