add files
This commit is contained in:
parent
96dac8cde5
commit
acabc10ceb
6
bsBpVisualiser.js
Normal file
6
bsBpVisualiser.js
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
export function bsBpVisualiser() {
|
||||||
|
$('.breakpointvisualiserWidth').text(window.innerWidth); // initial visualisation
|
||||||
|
window.onresize = function reportWindowSize() { //visualisation on resize window...
|
||||||
|
$('.breakpointvisualiserWidth').text(window.innerWidth);
|
||||||
|
}
|
||||||
|
}
|
10
bsBreakpointView.html
Normal file
10
bsBreakpointView.html
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
<!-- start bs breakpoint visualiser -->
|
||||||
|
<div id="bsBreakpointVisualiser">
|
||||||
|
<div class="bg-primary d-sm-none"><br><span class="breakpointvisualiserWidth">-</span></div>
|
||||||
|
<div class="bg-secondary d-none d-sm-block d-md-none"><br><span class="breakpointvisualiserWidth">-</span></div>
|
||||||
|
<div class="bg-warning d-none d-md-block d-lg-none"><br><span class="breakpointvisualiserWidth">-</span></div>
|
||||||
|
<div class="bg-danger d-none d-lg-block d-xl-none"><br><span class="breakpointvisualiserWidth">-</span></div>
|
||||||
|
<div class="bg-dark text-white d-none d-xl-block d-xxl-none"><br><span class="breakpointvisualiserWidth">-</span></div>
|
||||||
|
<div class="bg-light d-none d-xxl-block"><span class="breakpointvisualiserWidth">-</span></div>
|
||||||
|
</div>
|
||||||
|
<!-- start bs breakpoint visualiser -->
|
11
bsBreakpointVisualiser.css
Normal file
11
bsBreakpointVisualiser.css
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
#bsBreakpointVisualiser {
|
||||||
|
position: absolute;
|
||||||
|
top: 5%;
|
||||||
|
left: 0;
|
||||||
|
z-index: 10000;
|
||||||
|
height: 100px;
|
||||||
|
width: 100px;
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: bolder;
|
||||||
|
opacity: .4;
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user