Solved

Javascript animating div resize

Posted on 2015-01-13
3
127 Views
Last Modified: 2015-01-22
Hi Experts

I was trying to resize a div through animation, and I could fairly say that I've made it, however looking at the code, it sounds somehow lame and too many lines. Can we write it in a more professional way, like reducing the code lines ?

A workable example is attached for ease of reference, and here's an explanation of the variables:

objCtrl: a reference to an object to be resized (can be a div or panel)
blnSH: a Boolean variable indicate whether we should handle visibility.
intWS: starting object width
intHS: starting object height
intWE: object width
intHE: object height
dblWN: the new width value
dblHN: the new height value
dblWV: its the width value to be added or subtracted on interval
dblHV: its the height value to be added or subtracted on interval.

Many thanks indeed.
Default.aspx
0
Comment
Question by:Faraj1969
  • 2
3 Comments
 
LVL 11

Accepted Solution

by:
louisfr earned 500 total points
ID: 40549198
Did you try using a transition effect? http://www.w3schools.com/Css/css3_transitions.asp

There's also this page about transitions and animations using javascript: http://css-tricks.com/controlling-css-animations-transitions-javascript/
0
 

Author Comment

by:Faraj1969
ID: 40560748
Hi, I'm requested to make the project compatible with CSS 2, therfore first link doesn't help. I've reviewed the second one when I started writing the script, but it didn't really help either. Thanks.
0
 

Author Closing Comment

by:Faraj1969
ID: 40564359
Thanks for the efforts.
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article is meant to give a basic understanding of how to use R Sweave as a way to merge LaTeX and R code seamlessly into one presentable document.
Whether you’re a college noob or a soon-to-be pro, these tips are sure to help you in your journey to becoming a programming ninja and stand out from the crowd.
This tutorial covers a step-by-step guide to install VisualVM launcher in eclipse.
This tutorial explains how to use the VisualVM tool for the Java platform application. This video goes into detail on the Threads, Sampler, and Profiler tabs.

808 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question