Skip to content

Instantly share code, notes, and snippets.

Patryk Smakosz patsma

  • Poland
Block or report user

Report or block patsma

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View Image hover border animation.html
<div class="image-container-block">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/65984/photo-1413752567787-baa02dde3c65.jpg" alt="">
<div class="inner-image-block">
<div class="image-animate-border"></div>
</div>
</div>
<style>
</style>
View Safari input form
.wpcf7 form input {
-webkit-user-select: text;
}
@patsma
patsma / txt
Created Mar 20, 2018
OP meta tags
View txt
http://ogp.me
Basic Metadata
To turn your web pages into graph objects, you need to add basic metadata to your page. We've based the initial version of the protocol on RDFa which means that you'll place additional <meta> tags in the <head> of your web page. The four required properties for every page are:
og:title - The title of your object as it should appear within the graph, e.g., "The Rock".
og:type - The type of your object, e.g., "video.movie". Depending on the type you specify, other properties may also be required.
og:image - An image URL which should represent your object within the graph.
og:url - The canonical URL of your object that will be used as its permanent ID in the graph, e.g., "http://www.imdb.com/title/tt0117500/".
As an example, the following is the Open Graph protocol markup for The Rock on IMDB:
@patsma
patsma / timeline.js
Created Mar 13, 2018
Toggle timeline held in function
View timeline.js
var select = function(s){
return document.querySelector(s);
}
var normalTimelineGreen = select('.normalTimelineGreen');
var returnedTimelineRed = select('.returnedTimelineRed');
View Toggle GSAP menus
Some may find this confusing, but I like to tack .reverse() onto the end and toggle an animation like this...
var tl = new TimelineMax()
.to("#box", 0.25, { opacity: 0.5, scale: 0.75 })
.reverse();
$("#box").click(function() {
tl.reversed(!tl.reversed());
});
http://codepen.io/osublake/pen/9d46535fe6e5b5c8f577308a5ae1ea72
View gist:44be2909aa0eadba0bebb9ac24c3d4d7
Serwis nie zbiera w sposób automatyczny żadnych informacji, z wyjątkiem informacji zawartych w plikach cookies.
Pliki cookies (tzw. „ciasteczka”) stanowią dane informatyczne, w szczególności pliki tekstowe, które przechowywane są w urządzeniu końcowym Użytkownika Serwisu i przeznaczone są do korzystania ze stron internetowych Serwisu. Cookies zazwyczaj zawierają nazwę strony internetowej, z której pochodzą, czas przechowywania ich na urządzeniu końcowym oraz unikalny numer.
Podmiotem zamieszczającym na urządzeniu końcowym Użytkownika Serwisu pliki cookies, oraz uzyskującym do nich dostęp jest operator Serwisu SejmLog.
Pliki cookies wykorzystywane są w celu:
a) dostosowania zawartości stron internetowych Serwisu do preferencji Użytkownika oraz optymalizacji korzystania ze stron internetowych; w szczególności pliki te pozwalają rozpoznać urządzenie Użytkownika Serwisu i odpowiednio wyświetlić stronę internetową, dostosowaną do jego indywidualnych potrzeb;
View Toggle GREENSOCK TIMELINE
var t = TweenLite.to(element, 1, {x:300, paused:true, reversed:true});
t.reversed() ? t.play() : t.reverse();
View misc
$('body').append('<div style="" id="loadingDiv"><div class="loader">Loading...</div></div>');
$(window).on('load', function(){
setTimeout(removeLoader, 2000); //wait for page load PLUS two seconds.
});
function removeLoader(){
$( "#loadingDiv" ).fadeOut(500, function() {
// fadeOut complete. Remove the loading div
$( "#loadingDiv" ).remove(); //makes page more lightweight
});
}
View replace_nbsp_with_anything.js
jQuery('.mlw_qmn_question').each(function(i, el) {
el.innerHTML = el.innerHTML.replace(/&nbsp;&nbsp;/g,'&nbsp;');
});
View full-media-queries.css
/*
Based on:
1. http://stephen.io/mediaqueries
2. https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
*/
/* iPhone 6 in portrait & landscape */
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px) {
You can’t perform that action at this time.