spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / javascript / column33


Moving a DHTML Element

Developer News
News Flash: Adobe Has iPhone Workaround
Adobe's Flash 10.1 Goes Mobile (Minus iPhone)
A Salute to Visionary CEOs

In order to make DOCJSLIB as cross-browser as possible, we have reverted our vertical movement algorithm to use the top property instead of the moveBy() one that we used in our previous column. In Internet Explorer we keep using the pixelTop property:

function docjslib_moveVertically(id, increment) {
  if (NS4) eval(id).top += increment
  else eval(id).style.pixelTop += increment;
}

With this streamlining, our HTML Scroller from the previous column is much more compact. Let's take, for example, the section that moves the pages around. The moveUp() function moves up both pages and then switches between the pages when the lower one becomes negative:

function moveUp() {
    docjslib_moveVertically(firstPage, -Gincrement);
    docjslib_moveVertically(secondPage, -Gincrement);
    if (docjslib_getElementTop(lowerPage) <= 0) {
       docjslib_moveVertically(upperPage,
         docjslib_getElementHeight(upperPage) * 2);
  // (The above two lines should be joined as one line.
  // They have been split for formatting purposes.)
       rotateThePages();
     }
}

Notice that there is not a single check for the browser identification. All browser-dependent stuff is handled by DOCJSLIB. The algorithm for rotating the pages is explained in detail in our previous column. Just as a reminder, when the lower page becomes negative, the upper page is moved down by two page heights and the designation of upperPage and lowerPage switches.

http://www.internet.com

Produced by Yehuda Shiran and Tomer Shiran

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Building a Banking Application Home Page with OOP · Mixing Scripting Languages · Review: phpFox, a Social Networking CMS with all the Bells and Whistles
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Enterprise 2.0: Social Networking in the Cloud · BroadSoft Marketplace Hastens Pace of Telephony Innovation · Review: HTC Hero for Sprint


Created: January 4, 1999
Revised: January 4, 1999

URL: http://www.webreference.com/js/column33/move.html