Я изменил стиль кнопки ввода файла с помощью jquery, но мне нужно пространство между текстовым вводом и кнопкой.Стиль ввода типа файла
Как я могу это сделать?
Я использую этот учебник: http://www.appelsiini.net/projects/filestyle.
Я изменил стиль кнопки ввода файла с помощью jquery, но мне нужно пространство между текстовым вводом и кнопкой.Стиль ввода типа файла
Как я могу это сделать?
Я использую этот учебник: http://www.appelsiini.net/projects/filestyle.
вы можете редактировать яваскрипт исходного кода, добавить некоторый запас налево, как я («Левое поле:» 8px "),
попробовать с этим:
/*
* Style File - jQuery plugin for styling file input elements
*
* Copyright (c) 2007-2008 Mika Tuupola
*
* Licensed under the MIT license:
* http://www.opensource.org/licenses/mit-license.php
*
* Based on work by Shaun Inman
* http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom
*
* Revision: $Id: jquery.filestyle.js 303 2008-01-30 13:53:24Z tuupola $
*
*/
(function($) {
$.fn.filestyle = function(options) {
/* TODO: This should not override CSS. */
var settings = {
width : 250
};
if(options) {
$.extend(settings, options);
};
return this.each(function() {
var self = this;
var wrapper = $("<div>")
.css({
"width": settings.imagewidth + "px",
"height": settings.imageheight + "px",
"background": "url(" + settings.image + ") 0 0 no-repeat",
"background-position": "right",
"display": "inline",
"position": "absolute",
"overflow": "hidden"
"margin-left:"8px",
});
var filename = $('<input class="file">')
.addClass($(self).attr("class"))
.css({
"display": "inline",
"width": settings.width + "px"
});
$(self).before(filename);
$(self).wrap(wrapper);
$(self).css({
"position": "relative",
"height": settings.imageheight + "px",
"width": settings.width + "px",
"display": "inline",
"cursor": "pointer",
"opacity": "0.0"
});
if ($.browser.mozilla) {
if (/Win/.test(navigator.platform)) {
$(self).css("margin-left", "-142px");
} else {
$(self).css("margin-left", "-168px");
};
} else {
$(self).css("margin-left", settings.imagewidth - settings.width + "px");
};
$(self).bind("change", function() {
filename.val($(self).val());
});
});
};
})(jQuery);
у меня не получилось подумайте о своем коде, можете ли вы дать мне ссылку или что-то, чтобы объяснить это мне, я новичок, и я не понимаю, – Houx
входов файлов практически невозможно стиль большинство людей скрывают их и накладывают на них другие вещи и ставят на это стиль. –
редактируйте filestyle javascript и редактируйте функцию .css или добавляйте некоторый класс в элемент кнопки и стиляйте его с помощью таблиц стилей –