Open link from lightbox2 image data-title without shadow overlay? - html

I got a link to an orderform in my data-title image description. Unfortunatedly when it opens the page keeps the lightbox2 shadow overlay on top. The layer disapears if I click somewhere. Is there a way to breakout direct without clicking?
<a class="tile-inner" data-title="Text <a href='index.html#orderform' style='color:#EB590E;font-style:italic;font-weight:bold;'>Order now!</a>" data-lightbox="gallery" href="img/big/7.jpg">

Finaly I ended up with adding onclick='parent.window.location.reload();' and some variables (for the orderform preselect) to the link.

Related

How to fix anchor links that sometimes work, but other times jump to the wrong place?

Let me start by saying I am an absolute noob when it comes to coding. I hope this is the right place to post this as I am totally baffled.
I am using Wordpress Gutenberg to create a long article. I have a main table of contents near the top of the page (using the Table of Contents plugin). I also created anchor links within each section of the post to help ease navigation within each section.
Here is the link to help visualize: https://www.projectuntethered.com/best-gifts-for-travelers/
After finishing the post, I realized that the anchor links work at random. Sometimes they jump to the right spot, sometimes they don't.
For example, when I first load the page and click a link from the main table of contents, it doesn't go to the right place. But then if I scroll back to the top and try it a second time, it works.
The same happens with the anchor links within each section—usually the first try doesn't work and the second try does work.
Again, my apologies in advance if this isn't the place to post this. I'm new to this and didn't know where else to ask. Thanks!
Anchor link:
Hidden Pocket T-Shirt
Header it's supposed to jump to:
<h3 id="hidden-pocket-shirt-men"><a rel="noreferrer noopener nofollow" aria-label=" (opens in a new tab)" href="https://rads.stackoverflow.com/amzn/click/com/B00E9DJA5U" rel="nofollow noreferrer" target="_blank">Clever T-shirt with Hidden Pocket</a></h3>
Remove this
Hidden Pocket T-Shirt
This is what takes you to the top of the page.
Then change the link as
<a rel="noreferrer noopener nofollow" aria-label=" (opens in a new tab)"
href="https://rads.stackoverflow.com/amzn/click/com/B00E9DJA5U" rel="nofollow noreferrer" target="_blank">
<h3 id="hidden-pocket-shirt-men">Clever T-shirt with Hidden Pocket</h3>
</a>

How to pick the page icon tab and put as icon link in my body page Html, Css

I was doing a page with a list of sites I need to visit daily, such as exercise to learn Html, CSS. I would like to know if it is possible to create a link with a page icon that is in the upper tab of the browser (chrome).
Ex: I want to list StackOverflow on my site. So I create a link and for the icon, I want to use the image that is on the tab of the page itself, as in this:
You can use:
https://plus.google.com/_/favicon?domain=www.yourlink.com
example
<a href="">
<img src="https://plus.google.com/_/favicon?domain=www.stackoverflow.com"> Stackoverflow
</a>
If I'm correctly getting what you want, you'd need to either have a local copy or link to the sites' favicon, like so:
<img src="https://cdn.sstatic.net/Sites/stackoverflow/img/favicon.ico" />

Issue with editing hover state of KendoUI Button

I am attempting to alter the hover functionality of a KendoUI button. The HTML looks like the following:
<div class="div-vertical-delimitor div-float-left"></div>
<a id="a-draw-point" class="k-button single" title="Point">
<img id="img-draw-point" src="../Images/DT_DrawPoint.png">
</a>
</div>
The issue is, I'm not seeing a k-state-hover class being activated when I hover over the button. However, the button does change when hovering over it.
When hovering over other objects on the page such as toptab links I see the k-state-hover being applied when mousing on top of the link.
Any help would be appreciated. I'm new to CSS and KendoUI.

Light box displaying 2 images, thumbnail the issue?

I have a lightbox setup on my site and well I've got an unordered list and the images are displayed in a list item. I've got an href linking to the full size image then my lightbox code and then an img src with a thumbnail image. Why is my lightbox displaying 2 images and not the one.
I think it's displaying my thumbnail and the full size image but I'm not sure. When I click the image, it says 1-2. If you press the next button it shows the same image.
A peek at the code below. I expect it to be fairly simple but I'm learning..
<ul>
<li>
<a href="images/respectyourelders-full.png"
data-lightbox="recentwork"
data-title="This design was made for an apparel company called VolkWear Clothing.">
<img src="images/car1.png" alt="Respect your Elders Illustration" title="Respect your Elders Illustration" />
</a>
I am sure it is because you used data-lightbox="recentwork" for more than one hyperlink. Be sure to check it carefully.

How to add an anchor for a iframe loading tag?

I´m trying to add an anchor to this div:
<div class="mosaic-block bar">
<a href="javascript:loadintoIframe('myframe', 'portfolio/optica.html')" class="mosaic-overlay">
My goal is to click this button, load the iframe and then go to the anchor.
Is it possible?
Have you tried loadintoIframe('myframe','portfolio/optica.html#anchor');? Without seeing how your loadintoIframe function works, it's hard to tell.
If the iframe is already on the page, then you don't need JavaScript, just this:
<a href="portfolio/optica.html#anchor" target="myframe" ...>...</a>