There is no way to set the image size that you assign to an element’s pseudo like ::before. But do not fret. There is a workaround.
User David Vasquez of StackOverflow provided a solution for this. See sample CSS.
|
1 2 3 4 5 6 7 8 9 |
.element::before { display: inline-block; width: 16px; height: 16px; margin-right: 5px; content: ''; background: url('my_image.svg') no-repeat 0 0; background-size: 100%; } |
Share the post "How To Let Mouse Events Pass Through HTML Canvas"
This was an interesting scenario that I came across with. PDF.JS by default can let you select text and copy them to the clipboard. However, since my requirement had us do with creating annotations and since it is messy to mess around the DIV layers of the PDF.JS pages, we had to create a separate Canvas element to draw out annotations in.
Now, the problem is that since there is an extra Canvas layer on top of the existing Canvas layer of PDF.JS where they draw their images if the PDF contains pictures, selecting text is not possible.
However, through a CSS attribute it is possible to let mouse clicks pass through the Canvas element using the pointer-event attribute. The values for these are auto for enabled and none for disabled.
If you plan to use Javascript, use canvas.style.pointerEvents = ‘auto|none’
Share the post "JQuery UI DatePicker Not Shown In Bootstrap Modal Window"
Well, this one bugged me down for hours. I thought the problem was Bootstrap’s form-control CSS class since removing it shows the Jquery UI DatePicker widget but the input field styling is gone.
User lastoneisbearfood in the StackOverflow forum provided 2 easy solutions of your preference: either adding a css attribute or doing it Javascript style.
on-JS Just add z-index:1051; to the style attribute of your input element. This is based on the observation that bootstrap .modal class uses a z-index of 1050.
Dynamic solution using JS When declaring your datepicker, add a beforeShow handler that retrieves the z-index of .modal and set datepicker’s z-index to 1 higher than that:
|
1 2 3 4 |
datepicker({beforeShow: function(inputElem, inst) { var zi = Number($(inputElem).closest('.modal').css('z-index')); $(inputElem).css('z-index',zi+1); }}); |
