473,406 Members | 2,619 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,406 software developers and data experts.

Dragging Images in fixed DIVs like Google Maps

I am looking for a javascript solution to drag a series of images
(along the horizontal axis only) within a fixed div to give the same
drag effect of Google Maps. Here are the requirements:

The div will be fixed, and its only display purpose is to give the
preception of a "viewport" or window with its border. A variable number
of images will be displayed inside the div. They will be aligned in a
horizontal series, side by side, with some padding. Their dimensions
will be resized to a fixed width and height. If the number of images
inside the div exceeds the viewable space, instead of displaying a
horizontal scroll bar, the javascript function will allow the user to
click anywhere inside the div and, while holding down the mouse button,
horizontally scroll the images within the div left and right. This
dragging would ideally mimic that found on Google Maps but only along
the horizontal axis. If alt text could be enabled for each image, that
would be ideal as well.

Has anyone done or seen this? I could use ideas/help/examples if you
are willing to share. Thanks.

Jan 15 '06 #1
2 3087
http://www.walterzorn.com/dragdrop/dragdrop_e.htm

might be of help. check it carefully because i think it has the
horizontal stuff too.

Jan 15 '06 #2
Another library with drag support (as well as drop zones) is
script.aculo.us

http://script.aculo.us/

Nic

Jan 16 '06 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
by: stan k. | last post by:
First of all let me clarify - I am not talking about having a bunch of images loaded all at once (or preloaded) and then controlling the display of the images after that point -- I know that can be...
6
by: Robert J. O'Hara | last post by:
I'm one of those people who practices what some consider "dull" and others consider "elegantly conservative" page design. I appreciate good traditional typography and standards-compliant liquid...
20
by: Roberto | last post by:
Hallo, I'm building a page that wants to respect XHTML 1.0 strict and CSS2 specifics. In this page I have to present thumbnails arranged to cover the entire width of the window, but there are...
6
by: JimInOC | last post by:
Does anyone have any idea as to how google loads pieces of images together so as you drag new image pieces are loaded from the server? I haven't had much luck finding any articles on it. thanks
2
by: louloizides | last post by:
I'm trying to drag a bunch of images in a Google maps-esque style. The javascript is pretty simple, but whenever I go and drag over a large image the image toolbar comes up in IE and the image...
9
by: Troy Piggins | last post by:
If I use the code: ----- <div style="text-align: center;"> <a href="photos.php?img=xx1.jpg"> <img src="xx1.jpg" style="padding: 10px;" /> </a> <a href="photos.php?img=xx2.jpg">
2
by: M | last post by:
Could anyone please help me out? I am working on a new Intranethomepage for our company, and I really, really would like to make something similar to http://www.google.nl/ig? hl=nl . There you...
5
by: malik.mayank | last post by:
I am new to CSS and I want to have a fixed width web page that covers the entire area on the browser window. Something like http://maps.google.com I want the height to be equal to browser...
5
matheussousuke
by: matheussousuke | last post by:
Hello, I'm using tiny MCE plugin on my oscommerce and it is inserting my website URL when I use insert image function in the emails. The goal is: Make it send the email with the URL...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.