css-js-helpers-libs

PayPal - The safer, easier way to pay online!

TraderHub - daily stock picks, market signals, stock picking service

List of css, js libs and frameworks

MAC

AMPPS (if port 80 is busy)

$ sudo apachectl stop

Install RubyGem on Windows to use Hologram

Go to: http://rubyinstaller.org/downloads/
Install latest Ruby
Note: When installing Ruby make sure to check add PATH
Download latest DevKit
Create folder under C: C:\RubyDevKit and extract DivKit into
run: cd C:\RubyDevKit
run: ruby dk.rb init
Note: this will create config.yml
Open config.yml
Uncomment line:11 and modify to - C:/Ruby22-x64
run: ruby dk.rb install

Now you can use Hologram to generate styleguide for your CSS and JavaScript

CSS, JavaScript and PHP code documentation Gen.

Cocos2d-JS

Desktop apps with web technologies

ELECTRON: Build cross platform desktop apps with web technologies

JS: Fast image filters

[WebGLImageFilter: ](Fast image filters for Browsers with WebGL support)
jsfeat: The project aim is to explore JS/HTML5 possibilities using modern & state-of-art computer vision algorithms

Game Resources

Game Mechanic Explorer
visibility-polygon-js: This library can be used to construct a visibility polygon for a set of line segments
(WEB)SIGHT & LIGHT: how to create 2D visibility/shadow effects for your game
(GitHub)SIGHT & LIGHT: how to create 2D visibility/shadow effects for your game
2d Visibility: Ray casting
js-intersections: A JS utility class used to find intersections between any combination of lines, circles, ellipses, polylines, polygons, rectangles, quadratic beziers, and cubic beziers
js-intersections: Docs
[kld-intersections](A library of intersection algorithms covering all SVG shape types)

Extras

// PLACEHOLD.IT Example
http://placehold.it/136x136/09f/fff.png&text=136x136

// jQuery Smooth Mouse Wheel Scrolling
var page = $('body'),
    scrollRange = 60,
    scrollSpeed = 200;

$(window).mousewheel(function(event, delta, deltaX, deltaY) {
    if (delta < 0) {
        page.stop(true,true).animate({scrollTop: page.scrollTop()+scrollRange}, scrollSpeed);
    } else if (delta > 0) {
        page.stop(true,true).animate({scrollTop: page.scrollTop()-scrollRange}, scrollSpeed);
    }
    return false;
});

CSS

IE css trick

<!--[if IE 7]><html xmlns="http://www.w3.org/1999/xhtml" class="ie ie7"><![endif]-->
<!--[if IE 8]><html xmlns="http://www.w3.org/1999/xhtml" class="ie ie8"><![endif]-->
<!--[if IE 9]><html xmlns="http://www.w3.org/1999/xhtml" class="ie ie9"><![endif]-->
<!--[if !IE]><!--><html xmlns="http://www.w3.org/1999/xhtml"><!--<![endif]-->

Note: Internet Explorer 10 No Longer Support Conditional Comments

Yahoo Finance API

// Get
http://chartapi.finance.yahoo.com/instrument/1.0/aapl/chartdata;type=quote;range=1d/json
// You can use: json, csv or xml

PHP

PHP OAuth 2.0 Client - Provider Client Libraries

PhoneGap/Cordova

CSS

Animate.css: Just-add-water CSS animations

// Animate.css if you need a callbacks
$('div').addClass('animated flip')
       	.one('webkitAnimationStart mozAnimationStart MSAnimationStart oanimationstart animationstart', function () {
        	console.log('Animation Started');
       	})
       	.one('webkitAnimationIteration mozAnimationIteration MSAnimationIteration oanimationiteration animationiteration', function () {
            console.log('Animation Step');
        })
        .one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function () {
        	console.log('Animation Ends');
        });

Javascript

// Create Hammer custom gestures events
var myElement = document.getElementById('myElement');

// create a simple instance
// by default, it only adds horizontal recognizers
var mc = new Hammer.Manager(myElement);

mc.add(new Hammer.Swipe({ event: 'swipe', pointers: 1 }));

mc.add(new Hammer.Swipe({ event: 'twoswipe', pointers: 2 }));

// listen to events...
mc.on("swipe", function(ev) {
    myElement.textContent = '1 finger swipe: ' + ev.pointers.length;
    console.log(ev)
    
    setTimeout(function(){
      myElement.textContent = '';
    }, 3000);
});

mc.on("twoswipe", function(ev) {
    myElement.textContent = '2 finger swipe: ' + ev.pointers.length;
    console.log(ev)
    
    setTimeout(function(){
      myElement.textContent = '';
    }, 3000);
});

// Swipe to delete
var mc = new Hammer.Manager(myElement);

mc.add(new Hammer.Pan({ 
  event: 'swipeRight', 
  pointers: 1,
  direction: Hammer.DIRECTION_RIGHT
}));


// listen to events...
mc.on("swipeRight", function(ev) {
  //console.log(ev);
  
  var elem = ev.target;
  elem.style.left = ev.deltaX + 'px';
  
  // Mobile
  elem.addEventListener('touchend', function(){
    setTimeout(function(){
      elem.style.left = '0px';
    }, 0);
    
  });
  
  // PC
  elem.addEventListener('mouseup', function(){
    setTimeout(function(){
      elem.style.left = '0px';
    }, 0);
    
  });
});

// Add a thousands separator
// Example: 1000 will be 1,000
number.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,')

jQuery plugins

// Register Velocity.js a custom UI pack effect
$.Velocity.RegisterUI('callout.twirl', {
    defaultDuration: 3000,
    calls: [ 
			[ { rotateZ: 1080 }, 0.50 ],
			[ { scaleX: 0.5 }, 0.25, { easing: 'spring' } ],
			[ { scaleX: 1 }, 0.25, { easing: 'spring' } ]
    ]
});

$('div').velocity('callout.twirl');

blah2014 / css-js-helpers-libs Goto Github PK

css-js-helpers-libs's Introduction

css-js-helpers-libs

MAC

Install RubyGem on Windows to use Hologram

CSS, JavaScript and PHP code documentation Gen.

Cocos2d-JS

Desktop apps with web technologies

JS: Fast image filters

Game Resources

Extras

CSS

Yahoo Finance API

PHP

PHP OAuth 2.0 Client - Provider Client Libraries

PhoneGap/Cordova

CSS

Javascript

jQuery plugins

AngularJS

css-js-helpers-libs's People

Contributors

Stargazers

Watchers

Forkers

Recommend Projects

Recommend Topics

Recommend Org