Solved

Javascript animating div resize

Posted on 2015-01-13
3
138 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

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

Many of us here at EE write code. Many of us write exceptional code; just as many of us write exception-prone code. As we all should know, exceptions are a mechanism for handling errors which are typically out of our control. From database errors, t…
Navigation is an important part of web design from a usability perspective. But it is often a pain when it comes to a developer’s perspective. By navigation, it often means menuing. This is less theory and more practical of how to get a specific gro…
The viewer will learn how to clear a vector as well as how to detect empty vectors in C++.
The viewer will be introduced to the technique of using vectors in C++. The video will cover how to define a vector, store values in the vector and retrieve data from the values stored in the vector.

729 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