When using https://wave.webaim.org/ to check a page for accessibility It detects (3) red errors. seems this is all coming from colorbox jquery.colorbox.min.js
3x empty button
<button type="button" id="cboxPrevious">
<button type="button" id="cboxNext">
<button id="cboxSlideshow">
How can this be repaired? I know that the button type should be Some Content
Not
I had the same problem as you.. All I did was to disable a plugin called Yith compare..
Related
I am using Vuejs 2 and the v-tooltip npm package. I would like to display the v-tooltip only when a button is disabled. When it is not disabled, I don't want to display the v-tooltip at all.
<button
v-tooltip="message"
:disabled="true">
CLICK ME!
</button>
Let say you have a variable disabled in your state, it can be a condition as well a > b, then you can conditionally render the buttons.
<button
v-if="disabled"
v-tooltip="message"
:disabled="true">
CLICK ME!
</button>
<button
v-else
>
CLICK ME!
</button>
Or you can even try this
<button
v-tooltip="disabled ? message : ''"
:disabled="true">
CLICK ME!
</button>
maybe it will work
When I apply this example which display a button popover on hover (mouseenter) and hide it when not hovered (mouseleave), the popover display also when the button is clicked, and stay visible until the button is clicked a second time...
<button
type="button"
[popover]="popover"
placement="bottom"
triggers="mouseenter:mouseleave"
class="btn"
[ngClass]="btnClass"
></button>
The code above show the popover under the button when hovered, but also on the top of the button when clicked...
Is this a normal behaviour ?
Ngx-bootrap button don't like when an input is named popover, so replacing this by the following code works:
<button
type="button"
[popover]="anyThingButPopoverNamedVar"
placement="bottom"
triggers="mouseenter:mouseleave"
class="btn"
[ngClass]="btnClass"
></button>
I'm still learning, please help!
I am trying to apply a Modal Popup that appears only when a link is clicked instead of when the page loads. My Modal Popup does all work fine, but I want to turn off/prevent the Popup from appearing at all when the page loads and simply have it only invoke the Popup when my chosen link is clicked.
$(document).ready(function () {
$("#popup-1").myModal({
// Functionality goes below this line
});
});
And this
<div id="popup-1" class="myModal">
<div class="window">
<!-- Your popup content -->
<div class="wrap demo-1">
<div class="title">Some Text Here</p>
<form>
<input type="text" class="field" placeholder="Your email goes here" />
<input type="submit" class="closeModal send" value="Submit" />
</form>
<label class="deny closeModal">Some Text Here</label>
</div>
<div class="cta demo-1">
<span class="icon"></span>
<p>Some Text Here</span></p>
</div>
<!-- / Your popup content -->
</div>
</div>
Is there a simple fix I can apply to solve this issue? I have spent countless hours going through existing posts and forums but almost each enquiry doesnt target the same specific question im trying to achieve based on my actual existing code.
My cose for the Link Click to activate
Newsletter
your help is very much appreciated
Just execute your modal opening code when a link is clicked instead of when the ready event is fired :
$('#modal-link').on('click', function() {
$("#popup-1").myModal({
// Functionality goes below this line
});
});
assuming the link opening your modal is :
link
I have just one element that triggers a popover, and another element that closes it. If the popover is closed by this another element, then the next time I click the trigger, the popover won't show. I have to click it twice in order to see it opening.
I'm using Bootstrap v3.3.6 (latest version today). If I use previous versions of Bootstrap (i.e., v3.0.2), it works fine. Another questions in SO that solve this issue are using older versions of Bootstrap.
An example that illustrates this issue (in Codepen):
HTML:
<button class="btn btn-default" data-toggle="popover" data-content="This is a popover">
Toggle popover
</button>
<button class="cpo btn btn-danger">
Close popover
</button>
JS
$('[data-toggle="popover"]').popover();
$(".cpo").on("click", function(e) {
e.preventDefault();
$('[data-toggle="popover"]').popover('hide');
});
It's a known bug, with a fix pending of revision: github
When I'm using bootstrap 3 modal when I dismiss it the page reloads and /?is added to location string. How can I just dismiss and hide modal without page reload?
Your button that closes the modal will need to have the data-dismiss attribute and it should be equal to "modal"
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
This code is straight from the Bootstrap website (http://getbootstrap.com/javascript/#modals)