Ning Ma blog

my technology tips

CSS

Sass what is different between @include and @extend

For my understanding, extend not allowed customization, and include allowed. @extend

@include

jQuery large pictures with a loading spinner

Basic Version In our basic version, we will have a single div containing a loading spinner and once our large image is loaded (in the background) we will remove the spinner and insert our image. There’s a few ways to approach the loading screen, two of which are: Use a background image on the holder […]

cool jQuery touch slider owl carousel

Here is link http://owlgraphic.com/owlcarousel/ Touch enabled jQuery plugin that lets you create beautiful responsive carousel slider. 1. Load jQuery and include Owl Carousel plugin files To use Owl Carousel, you’ll need to make sure both the Owl and jQuery 1.7 or higher scripts are included.

2. Set up your HTML You don’t need any […]

Memory Game

Game link: http://www.maning.ca/ats/memory-game/ Download Demo: http://www.maning.ca/ats/memory-game/memory-game-Demo.zip “Memory game is a card game in which all of the cards are laid face down on a surface and two cards are flipped face up over each turn. The object of the game is to turn over pairs of matching cards.” I used half day to program this […]

ps how to make custom pattern

1. Create a pattern image Fire up a new canvas. It should be small (in terms of height x width). Image you are creating here will duplicate itself to form your pattern in the later stage. For this example, I’ll be using 8×8 pixel canvas, zoomed them up and create a small pattern like this. […]

Hide the Target URL of a Link in Status Bar

There are some instances where you have redirect the user through one page to get them to another page. There is a way to do this stealthily – without letting the user know that there was a redirect. Yes – it sounds evil – but it don’t have to be. Say you have a click […]

JQuery PHP MYSQL login panel example

View demo click here Download demo This is a cool simple login / registration system. It will give you the ability to easily create a member-only area on your site and provide an easy registration process. It is going to be PHP driven and store all the registrations into a MySQL database. To add the […]

, ,

Ajax Jquery and PHP contact form example

View demo click here Download demo

We use the $_SESSION array to populate the values of the input fields. This is done to insure that the data is not lost during page redirects, which occur when the form is submitted to submit.php during the regular form submit. Another important aspect are the classes assigned […]

JQuery gallery with pop up and next button

View demo click here Download demo PHP The idea is simple – our PHP back-end is going to scan a folder that we’ve set up with our gallery images, and turn it into a fancy CSS & jQuery gallery. The great thing about this strategy is that it is incredibly easy to set up a […]

Twitter and weibo example by PHP JQuery and AJAX

View demo click here Download demo Creating the DB If you’d like to run a working demo on your own site, you will have to create a MySQL table where all your tweets are going to be stored. You can run the following SQL code through phpMyAdmin (the code is also available in table.sql in […]

Previous Posts