This is just a combination of my previous post on moving and fading elements without JQuery. I just combine the two functions so that I can move elements and at the same time fade them. Here are the links to my previous posts:
1. Simple Javascript Fade In/Out Function without JQuery
2. Simple Javascript Element Moving Function without JQuery
The combination of these two functions:
<html>
<script>
var moveSpeed = 100; // interval in ms, smaller means faster
var moveStep...
Wednesday, December 31, 2014
Tuesday, December 30, 2014
Javascript to Zoom According to a Maximum Browser's Width
There will be times when you need to perform some zooming on the browser so that you'll see what things will look like in other resolutions. For example, if you need to know how your website looks like on an iPhone screen, you might this Javascript function that I am going to show you. But make sure you know the target screen resolution before you try the following codes out:
<html>
<script>
var width,zoomPercentage;
function setWidth(pixel) {
if (!pixel) {
zoomPercentage...
Wednesday, December 24, 2014
Simple Javascript Element Moving Function without JQuery
This is similar with my previous post except this is for moving HTML elements instead of fading them.
Note: Again, this is not to replace the existing JQuery codes. This is just for those who are curious about how things are moved with only Javascript codes without JQuery.
Here are the codes:
<html>
<script>
var moveSpeed = 100; // interval in ms, smaller means faster
var moveStep = 10; // pixel count in every move, bigger means faster
function moveObj(elemID) {
this.id...
Thursday, December 18, 2014
Latest Facebook Share Method for HTML (Dec 2014)
The Facebook share method has gone through a lots of changes since my last post long ago. Here is the latest update. Please note that these codes may not be working by the time you use them as Facebook updates its coding requirements very often.
Anyway, here are the codes:
<html>
<head>
<meta name="description" content="Welcome to my website! My phone number is 1234567! Thank you!">
<meta...
Wednesday, December 10, 2014
Simple Javascript Fade In/Out Function without JQuery
If you want to know how to write your own animation function such as those in JQuery, here is one of them. Please note that this is not to replace your JQuery scripts, it is just for those who are curious about how it can be done without JQuery.
Note: I also have similar codes for movement/animation here. You can combine these two capabilities to make it fade while moving. Of course, that can be a bit challenging.
Here are the codes:
<html>
<script>
var fadeSpeed =...
Subscribe to:
Posts (Atom)