Re: [Gimp-user] Adding Hotspots
Am 20.06.2016 um 22:31 schrieb Elle Stone: On 06/20/2016 04:18 PM, Pat David wrote: [...] This is different than an image rollover, which is more of what is being described in your link. Technically you _could_ create a text area near an image that could show different text varying based on context of mouse position (possibly triggered through :hover, :focus, or :blur events). But that's outside the scope of what OP was asking for I think. At least in the context of an image editing program. What the OP wants isn't part of any imaging program that I'm aware of. The picture in https://inkscape.org/de/~doctormo/%E2%98%85inkscape-hackfest-2016-group-photo is an SVG image embedded in a website. The SVG includes the photo as well, and in the embedding HTML there is a proper style defined (in the resource.css file), with the SVG elements tagged with this style information. Maybe this helps the OP. Best regards Chris tldr; sure you can do this - pick a programming language or html/css/possibly-js combination and augment your image in that way. Images themselves don't do this normally. Best, Elle ___ gimp-user-list mailing list List address:gimp-user-list@gnome.org List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list List archives: https://mail.gnome.org/archives/gimp-user-list ___ gimp-user-list mailing list List address:gimp-user-list@gnome.org List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list List archives: https://mail.gnome.org/archives/gimp-user-list
Re: [Gimp-user] Adding Hotspots
>> I want to add hotspots to my drawing where I can hover the mouse over an
> item and while it is there some additional information will pop up nearby
>
> This is different than an image rollover, which is more of what is being
> described in your link. Technically you _could_ create a text area near an
> image that could show different text varying based on context of mouse
> position (possibly triggered through :hover, :focus, or :blur events). But
> that's outside the scope of what OP was asking for I think. At least in
> the context of an image editing program.
>
> tldr; sure you can do this - pick a programming language or
> html/css/possibly-js combination and augment your image in that way.
> Images themselves don't do this normally.
I have never done this exact thing, but if I had to I would start by
trying this:
Make a CSS div the size of your image, and set that image as its
background; position this div wherever you want on the page. Inside
this, position one or more CSS divs, containing your desired text as the
visible part of a hyperlink. Style and position the hyperlink text in
the css code. Now hide the hyperlink, by adding visibility: none to the
css . Make a copy of the CSS code for the (now hidden) overlay text,
replace the "a" selector in your rule set's ID with a:hover (a so-called
pseudo class), and delete the line that says visibility: none. This
brings back the formatting you did earlier, but only when the mouse
pointer is over the div where the text is displayed.
You can remove the underline or other "link styling", get the color,
font weight & etc. you want, /and/ make your text a real hyperlink to
other content if so desired.
The bit that makes the text appear and disappear would look like this,
in the example the text is big, bold, white, and centered in its div:
xhtml (replacing angle brackets with square ones to avoid rendering in
HTML aware mail clients}:
[div class="hovertext"][a href="#"]Hello World[/a][/div]
css:
.hovertext a {
text-decoration: none;
font-family: Arial, Helvetica, Sans;
text-align: center;
font-size: 1.25;
font-weight: 700;
color: #fff;
display: none;
}
.hovertext a:hover {
text-decoration: none;
font-family: Arial, Helvetica, Sans;
text-align: center;
font-size: 1.25;
font-weight: 700;
color: #fff;
}
The CSS giveth, the CSS taketh away. Positioning, border if any, etc.
not included.
This code is Void where prohibited. Your mileage may vary. I just
pulled this out of [ahem!] so it may include stupid, obvious mistakes.
:o)
___
gimp-user-list mailing list
List address:gimp-user-list@gnome.org
List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list
List archives: https://mail.gnome.org/archives/gimp-user-list
Re: [Gimp-user] Adding Hotspots
On Mon, 2016-06-20 at 06:56 +0200, DavidWW wrote: > I want to add hotspots to my drawing where I can hover the mouse over > an item > and while it is there some additional information will pop up nearby. I'm going to assume you mean you want this to happen in a Web browser rather than in GIMP. One way is to use SVG for your image (you can include a bitmap); you can then either have text that appears only on a hover in a specific region (with :hover) or you can use "tooltips", although those can't easily contain complex formatting. To use SVG, when you're done with the bitmap image, load it into Inkscape. Without knowing more about what you're doing it's hard to go further with suggestions. Best, Liam -- Liam R. E. Quin World Wide Web Consortium - the organization responsible for the Web ___ gimp-user-list mailing list List address:gimp-user-list@gnome.org List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list List archives: https://mail.gnome.org/archives/gimp-user-list
Re: [Gimp-user] Adding Hotspots
On 06/20/2016 04:18 PM, Pat David wrote: On Mon, Jun 20, 2016 at 1:28 PM Elle Stone mailto:ellest...@ninedegreesbelow.com>> wrote: You can do "on hover text" without using javascript. Do an internet search on keywords such as: css image on hover text For example using css3: http://geekgirllife.com/place-text-over-images-on-hover-without-javascript/ Except I think the OP was asking about regional hover areas on an image overlaying information: > I want to add hotspots to my drawing where I can hover the mouse over an item and while it is there some additional information will pop up nearby I think this is closer to what the op is looking for (I remember this link from trying to do something similar awhile back): http://green-beast.com/experiments/css_map_pop.php This is different than an image rollover, which is more of what is being described in your link. Technically you _could_ create a text area near an image that could show different text varying based on context of mouse position (possibly triggered through :hover, :focus, or :blur events). But that's outside the scope of what OP was asking for I think. At least in the context of an image editing program. What the OP wants isn't part of any imaging program that I'm aware of. tldr; sure you can do this - pick a programming language or html/css/possibly-js combination and augment your image in that way. Images themselves don't do this normally. Best, Elle ___ gimp-user-list mailing list List address:gimp-user-list@gnome.org List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list List archives: https://mail.gnome.org/archives/gimp-user-list
Re: [Gimp-user] Adding Hotspots
On Mon, Jun 20, 2016 at 1:28 PM Elle Stone wrote: > You can do "on hover text" without using javascript. Do an internet > search on keywords such as: css image on hover text > > For example using css3: > http://geekgirllife.com/place-text-over-images-on-hover-without-javascript/ > > Except I think the OP was asking about regional hover areas on an image overlaying information: > I want to add hotspots to my drawing where I can hover the mouse over an item and while it is there some additional information will pop up nearby This is different than an image rollover, which is more of what is being described in your link. Technically you _could_ create a text area near an image that could show different text varying based on context of mouse position (possibly triggered through :hover, :focus, or :blur events). But that's outside the scope of what OP was asking for I think. At least in the context of an image editing program. tldr; sure you can do this - pick a programming language or html/css/possibly-js combination and augment your image in that way. Images themselves don't do this normally. -- Pat David https://pixls.us http://blog.patdavid.net ___ gimp-user-list mailing list List address:gimp-user-list@gnome.org List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list List archives: https://mail.gnome.org/archives/gimp-user-list
Re: [Gimp-user] Adding Hotspots
You can do "on hover text" without using javascript. Do an internet search on keywords such as: css image on hover text For example using css3: http://geekgirllife.com/place-text-over-images-on-hover-without-javascript/ There are also quite a few tutorials on the internet using css2. On 06/20/2016 02:15 PM, Joao S. O. Bueno wrote: actually, if you as much as create image maps, and replcae the relevant URLs by javascript URLs you should get as close as waht you wanta s possible. Of course, images on themselves do not perform any action - actions are all performed by the viewer program. Few programas will be more feature-rich than a browser anyway. Just beware the "image map" thing is an arcane html constrcut from the 90's - I am not sure it even works in a modern html5 borwser, but if it does, replacing the link targets with javascript actions should work just fine. On hover text isn't necessarily arcane or outdated. It can be a nice way to preset text information. Best, Elle -- http://ninedegreesbelow.com Color management and free/libre photography ___ gimp-user-list mailing list List address:gimp-user-list@gnome.org List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list List archives: https://mail.gnome.org/archives/gimp-user-list
Re: [Gimp-user] Adding Hotspots
actually, if you as much as create image maps, and replcae the relevant URLs by javascript URLs you should get as close as waht you wanta s possible. Of course, images on themselves do not perform any action - actions are all performed by the viewer program. Few programas will be more feature-rich than a browser anyway. Just beware the "image map" thing is an arcane html constrcut from the 90's - I am not sure it even works in a modern html5 borwser, but if it does, replacing the link targets with javascript actions should work just fine. On 20 June 2016 at 13:55, Pat David wrote: > No - this is not a function of any image formats usually without the > intervention of some further software. Images don't normally do this (and > probably shouldn't on their own, imo). > > On Mon, Jun 20, 2016 at 11:50 AM DavidWW wrote: > >> I want to add hotspots to my drawing where I can hover the mouse over an >> item >> and while it is there some additional information will pop up nearby. I >> have >> found information about creating image maps with Gimp but it has all been >> about >> creating hyperlinks that jump to a website when one clicks on part of the >> picture. There has been nothing about how to just get information to pop >> up on >> the screen when a mapped portion of the picture is clicked. >> >> Is there any way to info (text box) to display on the image when I hold or >> click >> the mouse on a relevant portion of the picture?? >> >> -- >> DavidWW (via www.gimpusers.com/forums) >> ___ >> gimp-user-list mailing list >> List address:gimp-user-list@gnome.org >> List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list >> List archives: https://mail.gnome.org/archives/gimp-user-list >> > -- > Pat David > https://pixls.us > http://blog.patdavid.net > ___ > gimp-user-list mailing list > List address:gimp-user-list@gnome.org > List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list > List archives: https://mail.gnome.org/archives/gimp-user-list ___ gimp-user-list mailing list List address:gimp-user-list@gnome.org List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list List archives: https://mail.gnome.org/archives/gimp-user-list
Re: [Gimp-user] Adding Hotspots
No - this is not a function of any image formats usually without the intervention of some further software. Images don't normally do this (and probably shouldn't on their own, imo). On Mon, Jun 20, 2016 at 11:50 AM DavidWW wrote: > I want to add hotspots to my drawing where I can hover the mouse over an > item > and while it is there some additional information will pop up nearby. I > have > found information about creating image maps with Gimp but it has all been > about > creating hyperlinks that jump to a website when one clicks on part of the > picture. There has been nothing about how to just get information to pop > up on > the screen when a mapped portion of the picture is clicked. > > Is there any way to info (text box) to display on the image when I hold or > click > the mouse on a relevant portion of the picture?? > > -- > DavidWW (via www.gimpusers.com/forums) > ___ > gimp-user-list mailing list > List address:gimp-user-list@gnome.org > List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list > List archives: https://mail.gnome.org/archives/gimp-user-list > -- Pat David https://pixls.us http://blog.patdavid.net ___ gimp-user-list mailing list List address:gimp-user-list@gnome.org List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list List archives: https://mail.gnome.org/archives/gimp-user-list
