How to add floating image to page? |
How to add floating image to page? |
Cosmo |
Apr 27 2017, 02:03 PM
Post
#1
|
Group: Members Posts: 3 Joined: 27-April 17 Member No.: 26,386 |
Hi Forum,
Newbie here. I'm hoping someone out there may be able to help with this. I'm trying to add a small floating security seal image, bottom/right corner. When I say 'floating' I do not mean text wrapped. I mean floating, as in maintaining its position regardless of the vertical page scrolling. Code provided goes like this: <a href="https://ssl.comodo.com"> <img src="https://ssl.comodo.com/images/comodo_secure_seal_113x59_transp.png" alt="SSL Certificate" width="113" height="59" style="border: 0px;"></a><br> <span style="font-weight:bold; font-size:7pt"><a href="https://ssl.comodo.com">SSL Certificate</a></span><br> Placement is the problem. Thanks for any help. This post has been edited by Cosmo: Apr 27 2017, 02:09 PM Attached thumbnail(s) Attached File(s) Page_1.txt ( 1.96k ) Number of downloads: 177 |
pandy |
Apr 27 2017, 02:29 PM
Post
#2
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Sounds like you are looking for position: fixed .
https://www.w3.org/TR/CSS2/visuren.html#propdef-position |
Cosmo |
Apr 27 2017, 03:10 PM
Post
#3
|
Group: Members Posts: 3 Joined: 27-April 17 Member No.: 26,386 |
I think so. Sorry, but I did not include the following:
Add this before your </HEAD> tag <script type="text/javascript"> //<![CDATA[ var tlJsHost = ((window.location.protocol == "https:") ? "https://secure.comodo.com/" : "http://www.trustlogo.com/"); document.write(unescape("%3Cscript src='" + tlJsHost + "trustlogo/javascript/trustlogo.js' type='text/javascript'%3E%3C/script%3E")); //]]> </script> Add this before your </BODY> tag <script language="JavaScript" type="text/javascript"> TrustLogo("www.mysite.com", "CL1", "none"); </script> <a href="https://www.instantssl.com/" id="comodoTL">Essential SSL</a> I found that these snippets are required to make the seal work. I am not sure how the third piece of code (first post, above) comes into play. With the two snippets installed, the 'seal' is placed bottom/left and works, but the seal image is missing - only a greyed-out square. This post has been edited by Cosmo: Apr 27 2017, 03:11 PM |
pandy |
Apr 27 2017, 05:50 PM
Post
#4
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
The file you attached is a template that some server side program turns into HTML. You need to go to the page with a browser and view source to get the HTML. A browser with a feature called "Inspect Element" or similar will also show you the HTML the script writes out.
When pasting the scripts in a blank document the inspector tells me this is the HTML the script produces. CODE <img src="www.mysite.com" border="0" onmousedown="return tLKB(event,'http://www.trustlogo.com/ttb_searcher/trustlogo?v_querytype=W&v_shortname=CL1&v_search=file:///C%25253A/Documents%25252520and%25252520Settings/admin/Desktop/TEST/test.html&x=6&y=5');" oncontextmenu="return tLLB(event);"> The below CSS selector should match that image and nothing else. CODE img[oncontextmenu="return tLLB(event);"] So, in my empty document this line of CSS does the trick. CODE img[oncontextmenu="return tLLB(event);"] { position: fixed; right: 15px; bottom: 15px } I set the offset to 15px from the bottom right corner. You can change that as you please. It worked for me, but you could have something in your HTML and CSS that makes it not work. You have to try it. Also, in the second script, did you put www.mysite.com there for the forum? If not you should put your real URL there. |
Cosmo |
Apr 28 2017, 04:36 PM
Post
#5
|
Group: Members Posts: 3 Joined: 27-April 17 Member No.: 26,386 |
Thank you for the help!! Yes mysite is generic.
Unfortunately still lost on this. I'm guessing I need to edit not only the page html but a css file also... |
pandy |
Apr 29 2017, 05:43 AM
Post
#6
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Yes. Put that line in your style sheet. Or in a style block in HEAD. The problem is you can't edit the HTML directly (I suppose) and if you don't want to mess with the template it's probably easier to put it in an already existing external style sheet.
|
Lo-Fi Version | Time is now: 18th April 2024 - 12:25 AM |