Загрузка изображений в WKWebView на macOS
jQuery CROSS BROWSER CUSTOM PLUGIN - $ .footerBottom ()
Или используйте jQuery, как я, и установите высоту нижнего колонтитула auto или fix, что бы вы ни хотели, он будет работать так или иначе. этот плагин использует селектор jQuery, поэтому для его работы вам нужно будет включить библиотеку jQuery в ваш файл.
Вот как вы запускаете плагин. Импортируйте jQuery, скопируйте код этого настраиваемого плагина jQuery и импортируйте его после импорта jQuery! Это очень простой и простой, но важный.
Когда вы это сделаете, все, что вам нужно сделать, это запустить этот код:
$.footerBottom({target:"footer"}); //as html5 tag <footer>.
// You can change it to your preferred "div" with for example class "footer"
// by setting target to {target:"div.footer"}
нет необходимости размещать его внутри события готовности документа. Он будет работать хорошо, как есть. Он пересчитает положение вашего нижнего колонтитула при загрузке страницы и при изменении размера окна.
Вот код плагина, который вам не нужно понимать. Просто знайте, как его реализовать. Это делает для вас работу. Однако, если вам нравится знать, как это работает, просто просмотрите код. Я оставлял комментарии для вас.
//import jQuery library before this script
// Import jQuery library before this script
// Our custom jQuery Plugin
(function($) {
$.footerBottom = function(options) { // Or use "$.fn.footerBottom" or "$.footerBottom" to call it globally directly from $.footerBottom();
var defaults = {
target: "footer",
container: "html",
innercontainer: "body",
css: {
footer: {
position: "absolute",
left: 0,
bottom: 0,
},
html: {
position: "relative",
minHeight: "100%"
}
}
};
options = $.extend(defaults, options);
// JUST SET SOME CSS DEFINED IN THE DEFAULTS SETTINGS ABOVE
$(options.target).css({
"position": options.css.footer.position,
"left": options.css.footer.left,
"bottom": options.css.footer.bottom,
});
$(options.container).css({
"position": options.css.html.position,
"min-height": options.css.html.minHeight,
});
function logic() {
var footerOuterHeight = $(options.target).outerHeight(); // Get outer footer height
$(options.innercontainer).css('padding-bottom', footerOuterHeight + "px"); // Set padding equal to footer height on body element
$(options.target).css('height', footerOuterHeight + "!important"); // Set outerHeight of footer element to ... footer
console.log("jQ custom plugin footerBottom runs"); // Display text in console so ou can check that it works in your browser. Delete it if you like.
};
// DEFINE WHEN TO RUN FUNCTION
$(window).on('load resize', function() { // Run on page loaded and on window resized
logic();
});
// RETURN OBJECT FOR CHAINING IF NEEDED - IF NOT DELETE
// return this.each(function() {
// this.checked = true;
// });
// return this;
};
})(jQuery); // End of plugin
// USE EXAMPLE
$.footerBottom(); // Run our plugin with all default settings for HTML5/* Set your footer CSS to what ever you like it will work anyway */
footer {
box-sizing: border-box;
height: auto;
width: 100%;
padding: 30px 0;
background-color: black;
color: white;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- The structure doesn't matter much, you will always have html and body tag, so just make sure to point to your footer as needed if you use html5, as it should just do nothing run plugin with no settings it will work by default with the <footer> html5 tag -->
<body>
<div class="content">
<header>
<nav>
<ul>
<li>link</li>
<li>link</li>
<li>link</li>
<li>link</li>
<li>link</li>
<li>link</li>
</ul>
</nav>
</header>
<section>
<p></p>
<p>Lorem ipsum...</p>
</section>
</div>
<footer>
<p>Copyright 2009 Your name</p>
<p>Copyright 2009 Your name</p>
<p>Copyright 2009 Your name</p>
</footer>1 ответ
В этом случае вы должны представить изображение как Base64 String, попробуйте ниже код
func getImageString(imageLocalPath: String) -> String? {
//get UIImage from localPath
let image:UIImage = // some method
if let _image = image {
// assume image is png, if not use relevant constrauction
var data = UIImagePNGRepresentation(_image)!
if let _data = data {
let data64 = _data.base64EncodedString(options:
Data.Base64EncodingOptions.endLineWithCarriageReturn)
return "<img src='data:image/\(format);base64," + data64 + "' height=200 width=400>"
}
}
return nil
}
Добавьте полоску изображения следующим образом, тогда он должен появиться
var data64 = getImageString(//image_local path)
"<img src='data:image/\(format);base64," + data64 + "' height=200 width=400>"