Does anyone have a browser that will view this html5 page properly?


C

cwdjrxyz

See http://www.cwdjr.net/html5/ParrotPuzzle/parrot_puzzle/picturePuzzle.html
and see if you can drag the images and that they will remain where
they were just before you release the mouse key. I have tried the
latest versions of Firefox, Opera, Chrome, Safari for Windows, and IE9-
beta, and all failed.

A new attribute introduced for <img> in html5 is draggable="true". It
may be that few if any browsers support this yet. Of course I may have
made an error. The page validates as html5 at w3c, and the css
validator finds no errors.

It seems this new image attribute might have some uses. Of course you
can now use javascript to drag, and some might remember my parrot
puzzle which used a script to make images draggable. If the draggable
attribute becomes widely supported in the future, it might be more
easy to use than script for applications such as games and puzzles.
 
Ad

Advertisements

D

dorayme

<[email protected]
cwdjrxyz said:
See http://www.cwdjr.net/html5/ParrotPuzzle/parrot_puzzle/picturePuzzle.html
and see if you can drag the images and that they will remain where
they were just before you release the mouse key.

Don't understand the bit about remaining where they were but I
can drag all your images easily on Mac OS 10.4 and Safari 3.1.2
onto the desktop.

On a Mac you just drop them on the desktop; where they end up on
the desk is determined by previously set user preferences (I have
mine in date order and so everything new rushes to the right top
corner just under icon for my HDs)
 
C

cwdjrxyz

<[email protected]



Don't understand the bit about remaining where they were but I
can drag all your images easily on Mac OS 10.4 and Safari 3.1.2
onto the desktop.

On a Mac you just drop them on the desktop; where they end up on
the desk is determined by previously set user preferences (I have
mine in date order and so everything new rushes to the right top
corner just under icon for my HDs)

Thanks. I want the images to drag around the web page screen only to
recover the whole picture. I can get the images to drag around while
pressing the mouse left key, but they revert back to where they were
as soon as I release the mouse key. I too can drag the images off of
the web page screen to the desktop or some other file in a window.
However the desktop and other files are formatted so you can not place
the images where you want them to recover the whole seamless picture
but only in neat rows and columns with a name under each image. I am
using 64-bit Windows Vista.
 
C

cwdjrxyz

 Thanks. I want the images to drag around the web page screen only to
recover the whole picture. I can get the images to drag around while
pressing the mouse left key, but they revert back to where they were
as soon as I release the mouse key. I too can drag the images off of
the web page screen to the desktop or some other file in a window.
However the desktop and other files are formatted so you can not place
the images where you want them to recover the whole seamless picture
but only in neat rows and columns with a name under each image. I am
using 64-bit Windows Vista.

The same page that uses Javascript to drag the images on the page
screen is at http://www.cwdjr.net/test/picturePuzzle.html . The image
sticks in place when you release the mouse button.
 
D

dorayme

<[email protected]
m>,
cwdjrxyz said:
The same page that uses Javascript to drag the images on the page
screen is at http://www.cwdjr.net/test/picturePuzzle.html . The image
sticks in place when you release the mouse button.

Yes, that one is fun to drag about, I instinctively wanted to use
my arrow buttons to jiggle into place for fine tuning after
dragging, perhaps you can build such thing in? Also wanted to be
able to move groups of photos about as one, but could not.
 
N

Neredbojias

See
http://www.cwdjr.net/html5/ParrotPuzzle/parrot_puzzle/picturePuzzle.ht
ml and see if you can drag the images and that they will remain where
they were just before you release the mouse key. I have tried the
latest versions of Firefox, Opera, Chrome, Safari for Windows, and
IE9- beta, and all failed.

A new attribute introduced for <img> in html5 is draggable="true". It
may be that few if any browsers support this yet. Of course I may
have made an error. The page validates as html5 at w3c, and the css
validator finds no errors.

It seems this new image attribute might have some uses. Of course you
can now use javascript to drag, and some might remember my parrot
puzzle which used a script to make images draggable. If the draggable
attribute becomes widely supported in the future, it might be more
easy to use than script for applications such as games and puzzles.

Er, it's a bit more complicated than that. Furthermore, <img>s are
draggable by default.

Here's a link that shows some working draggabilities and might help
explain it. You need javascript in any case.

http://ljouanneau.com/lab/html5/demodragdrop.html
 
Ad

Advertisements

C

cwdjrxyz

Er, it's a bit more complicated than that.  Furthermore, <img>s are
draggable by default.

Here's a link that shows some working draggabilities and might help
explain it.  You need javascript in any case.

http://ljouanneau.com/lab/html5/demodragdrop.html
It turns out that the new html5 attribute draggable for <img> is less
useful than I had hoped. It defaults to auto if you do not specify
draggable, which is "true" on at least all of my browsers. Thus
setting to draggable ="true" really does nothing. If you set
draggable="false", what you get if the browser understands the html5
attribute is that the image will not respond at all if you try to
drag it anywhere. I find that of all of the most recent versions of
browsers I mentioned, except Opera, are responding to the html5
attribute draggable="false" by not allowing the image to be moved
anywhere. Opera does not respond to draggable and thus only allows you
to drag and drop to another file as is the case for earlier versions
of html.. Unfortunately you will thus still have to use a script to
drag an image around on the web page window and drop it when you
release the mouse button. See http://www.cwdjr.net/html5/ParrotPuzzle/parrot_puzzle/picturePuzzle2.html
for the test page set for draggable="false".
 
C

cwdjrxyz

Yours works as intended on Mozilla-based browsers.  On the OP's page I
can drag but the images snap back to their original position when I
release the mouse button.

Yes, and also so are all of the other browsers I mentioned, except
Opera which Idiscussed in an answer to an earlier post.
 
C

cwdjrxyz

Opera (up to 10.7/9053) doesn't yet support 'draggable.'

My new test page with draggable set to "false" confirms this. All
browsers mentioned responded to "false" by not allowing an image to be
moved at all. Opera did not respond and acted just as drag and drop
does on earlier versions of html . See
http://www.cwdjr.net/html5/ParrotPuzzle/parrot_puzzle/picturePuzzle2.html
to check yourself when draggable is set to "false".

This reference was helpful.
 
D

dorayme

Ed Jay said:
Drag and drop?

With the original URL I could drag and drop to desktop and drag
and whip the pics back to where they were and that was it. Whip?
When you pull an elastic band back and let it go, it can
sometimes whip and sting your hand and hurt; if you are too well
brought up, you usually just say say "ouch".

I was absent-minededly thinking this post was about drag
prevention. I had not done my research or attended. I make
mistakes, I am after all, only non-human. Apologies to cwdjrxyz.
I can drag them to the desktop, but they manifest as shortcuts to the
image.

Yes, this was something that slightly surprised me on Windows, I
know to do this with things internal to a Win OS but what happens
with a shortcut (called "aliases" on Macs) when the pic is on an
external server and the shortcut only is on your desktop?

Big fat nothing? Or something really clever like you drag the
image and a shortcut is created and something is watching you and
thinks, Gee, this guy wants a shortcut but he is going to be
really pissed off later off line when he gets one of our zillion
notices to say target can't be found so we better download the
target and stick it on his HD (he does not need to know where, we
know best, we didn't get rich because of our pretty faces).

On Macs, you take the real thing for a ride and put it wherever
you want in one go. If you want the sophistication of the real
pic somewhere and an alias elsewhere you can take that extra step
to create an alias.

 
Ad

Advertisements

N

Neredbojias

It turns out that the new html5 attribute draggable for <img> is less
useful than I had hoped. It defaults to auto if you do not specify
draggable, which is "true" on at least all of my browsers. Thus
setting to draggable ="true" really does nothing. If you set
draggable="false", what you get if the browser understands the html5
attribute is that the image will not respond at all if you try to
drag it anywhere. I find that of all of the most recent versions of
browsers I mentioned, except Opera, are responding to the html5
attribute draggable="false" by not allowing the image to be moved
anywhere. Opera does not respond to draggable and thus only allows
you to drag and drop to another file as is the case for earlier
versions of html.. Unfortunately you will thus still have to use a
script to drag an image around on the web page window and drop it
when you release the mouse button. See
http://www.cwdjr.net/html5/ParrotPuzzle/parrot_puzzle/picturePuzzle2.h
tml for the test page set for draggable="false".

Without being an expert on the subject, I think "draggable" was added
so you could drag divs, spans, etc., around like you can images - with
the proper support. IOW, not to faciliate dragging images.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top