用例#1:
如果浏览器宽度大于500px,以下演示将为图像加载缩放功能。
https://codepen.io/zuhocuyixu/pen/NYLZrY
<!-- Loading .js file with Head.js
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/headjs/1.0.3/head.js"></script>
<script>
if (window.innerWidth > 500) {
head.ready(document, function() {
head.load('https://cdnjs.cloudflare.com/ajax/libs/zooming/1.4.2/zooming.js', function() {
var ZoomingIsLoaded = true;
var zooming = new Zooming();
zooming.listen('.value-img');
});
});
}
else {
var ZoomingIsLoaded = false;
}
</script>
<script type="text/javascript">
var myVar="ReCheckIfZoomingShouldBeLoaded";
function ReCheckIfZoomingShouldBeLoaded() {
if (window.innerWidth > 500 && ZoomingIsLoaded == false) {
head.ready(document, function() {
head.load('https://cdnjs.cloudflare.com/ajax/libs/zooming/1.4.2/zooming.js', function() {
var zooming = new Zooming();
zooming.listen('.value-img');
var ZoomingIsLoaded = true;
});
});
}
}
</script>
用例#2:
如果宽度小于500px则不会加载缩放,虽然在浏览器调整大小时它会检查宽度是否大于500px然后加载缩放功能。
问题在于,一旦它加载了缩放功能,它就会出现问题并且在关闭时会出现奇怪的现象。
如何修复这个故障的任何想法?
如果有人知道如果浏览器宽度低于500px,如何卸载缩放功能,那将非常有帮助。