It would be great for the next version if you could add a magnifying glass when the user hovers over the picture. (only if the picture can be made larger would the magnifying glass appear)
Because now there is no way to know if the picture can be made larger or not. The only way to know is to click on it.
XFileSharing Pro - Suggestion for next version
this is actually very simple to do with CSS.
You can use an image as your cursor when hovering over an image:
I suggest u make all images a fixed size and when clicked, it'll show actual image
Of course you can do much more tricks but that's a simple idea of it ^_^
You can use an image as your cursor when hovering over an image:
Code: Select all
.thumb img:hover {cursor: url(images/my-cursor.png), auto;}
I suggest u make all images a fixed size and when clicked, it'll show actual image
Code: Select all
<div class="thumb"><a href="blah.jpg"><img src="blah.jpg" width="200" height="200" alt="blah" /></a></div>
Of course you can do much more tricks but that's a simple idea of it ^_^
I uploaded the photo and then I added this:
.thumb img:hover {cursor: url(images/my-cursor.png), auto;}
to the main.css
but nothing happens.
I see what you mean. Put every photo 200x200. So that would mean every photo has to be clicked to make bigger. But im trying to minimize the amount of clicks the user has to click.
So i thought if someone uploads a photo 600x600 it wouldnt have to be clicked. But if i made it to 200x200 it would have to be clicked. So it would mean the viewer has to click. Maybe they would get tired to always clicking.
So the magnifying glass would be better. It would tell the user that the picture can be made larger, without having to click to find out.
.thumb img:hover {cursor: url(images/my-cursor.png), auto;}
to the main.css
but nothing happens.
I see what you mean. Put every photo 200x200. So that would mean every photo has to be clicked to make bigger. But im trying to minimize the amount of clicks the user has to click.
So i thought if someone uploads a photo 600x600 it wouldnt have to be clicked. But if i made it to 200x200 it would have to be clicked. So it would mean the viewer has to click. Maybe they would get tired to always clicking.
So the magnifying glass would be better. It would tell the user that the picture can be made larger, without having to click to find out.
I got it to work using by removing the "thumb"
But now the problem is that it shows up on every photo. Even the photos that cannot be resized.
imagebam does it.
hover image
http://www.imagebam.com/image/a91e2d100916746
no hover image
http://www.imagebam.com/image/fb80b331171588
Code: Select all
img:hover {cursor: url(images/my-cursor.png), auto;}
But now the problem is that it shows up on every photo. Even the photos that cannot be resized.
imagebam does it.
hover image
http://www.imagebam.com/image/a91e2d100916746
no hover image
http://www.imagebam.com/image/fb80b331171588
XFilesharing already has that feature for a long time (not for hover, but on click). Example: http://xfilesharing.com/hlp9rmu7p53c/xf ... g.jpg.html
I don't mean click. I mean hover. Hover is different.
Because if i upload an image that is 400x400 then if i click on it. It doesn't get big. Because it is at max 400x400
With hover, The user would now it is not able to get bigger. So he would not click
With hover, if has to click to see if it can be bigger sized or not
Because if i upload an image that is 400x400 then if i click on it. It doesn't get big. Because it is at max 400x400
With hover, The user would now it is not able to get bigger. So he would not click
With hover, if has to click to see if it can be bigger sized or not
-
- Posts: 101
- Joined: Aug 23, 2014 2:59 pm
the .thumb part was the <div>.
That means with the </div> finishing the class the hover would stay in there only. Not all over your site.
by adding
img:hover {cursor: url(images/my-cursor.png), auto;}
everytime you have an img for e.g <img src="smiley.gif"> it would make the magnify glass.
You are starting to sound fairly flustered when people are just trying to help you.
That means with the </div> finishing the class the hover would stay in there only. Not all over your site.
by adding
img:hover {cursor: url(images/my-cursor.png), auto;}
everytime you have an img for e.g <img src="smiley.gif"> it would make the magnify glass.
You are starting to sound fairly flustered when people are just trying to help you.