CSS: Hover over text - Image popup, CSS: Hover over text - Image popup |
CSS: Hover over text - Image popup, CSS: Hover over text - Image popup |
GMag |
Jan 13 2016, 09:32 AM
Post
#1
|
Group: Members Posts: 2 Joined: 13-January 16 Member No.: 23,902 |
Hi Folks,
I have found some examples online of how to code this but I cannot get it working. Im not coding a standard web page but in an editor using macros. So I have CSS Stylesheet macro, HTML Image, HTML Body macro, etc. I have a link to a page. I want to use this link as a preview so when the user hovers over the link more information will be provided in form of a popup image! Would you guys be able to help me with this?? Thanks, GMag |
pandy |
Jan 13 2016, 01:39 PM
Post
#2
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,716 Joined: 9-August 06 Member No.: 6 |
You need to show your stuff.
|
GMag |
Jan 14 2016, 10:21 AM
Post
#3
|
Group: Members Posts: 2 Joined: 13-January 16 Member No.: 23,902 |
You need to show your stuff. I found this hover feature (http://www.wickham43.net/hoverpopups.php) : The styles in the head section style tags of this page (which should preferably be in a separate stylesheet) are:- #tooltip1 { position: relative; } #tooltip1 a span { display: none; color: #FFFFFF; } #tooltip1 a:hover span { display: block; position: absolute; width: 200px; background: #aaa url(images/horses200x50.jpg); height: 50px; left: 100px; top: -10px; color: #FFFFFF; padding: 0 5px; } The html markup is:- <p id="tooltip1"><a href="introduction.php">Introduction<span>Introduction to HTML and CSS: tooltip with extra text</span></a></p> ********************** Im using WIKI Markup for most of it but I cannot seem to get this working. Is there anyone experienced with working with WIKIs. I can't provide you with the web URL atm. Would really appreciate some help with this. GMag |
pandy |
Jan 14 2016, 10:47 AM
Post
#4
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,716 Joined: 9-August 06 Member No.: 6 |
Then it isn't possible for us to help you. We can't guess what's wrong.
|
Frederiek |
Jan 14 2016, 11:58 AM
Post
#5
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
You should be looking in the tutorial.css at that url.
What you need starts at line 615. |
pandy |
Jan 15 2016, 03:40 AM
Post
#6
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,716 Joined: 9-August 06 Member No.: 6 |
What CMag posted should work fine. Something is different in the Wiki page or there's a conflict with other style sheets.
|
Frederiek |
Jan 15 2016, 05:13 AM
Post
#7
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
Maybe, I have't tried. I simply inspected the Home link on the page he/she posted.
Wait a minute. It's the third example at that page that uses the posted CSS. So, that should indeed work. We'll see when GMag posts back. Although I don't quite understand the editor and its macros he/she talks about. |
Lo-Fi Version | Time is now: 29th March 2024 - 02:17 AM |