Я согласен с Джимом Блазиджем. База данных не входит в состав вашего технологического стека, который должен отправлять электронные письма. Например, что, если вы отправляете электронное письмо, а затем откатываете изменение, которое вызвало это письмо? Вы не можете вернуть письмо.
Лучше отправить электронное письмо на уровне вашего приложения, после , ваше приложение подтвердило, что смена SQL была выполнена успешно и выполнена.
Я знаю, что это старый вопрос, но, может быть, я могу кому-то помочь, потому что это также ставило меня в тупик, пока я немного не прочел документацию:
prevArrow string (html | jQuery селектор) | object (DOM node | jQuery object) Previous Позволяет выбрать узел или настроить HTML-код для стрелки «Назад».
Строка nextArrow (html | jQuery selector) | объект (узел DOM | объект jQuery) Далее Позволяет выбрать узел или настроить HTML-код для стрелки «Далее».
Вот как я изменил свои кнопки ... работал отлично.
$('.carousel-content').slick({
prevArrow:"<img class='a-left control-c prev slick-prev' src='../images/shoe_story/arrow-left.png'>",
nextArrow:"<img class='a-right control-c next slick-next' src='../images/shoe_story/arrow-right.png'>"
});
prevArrow / nextArrow
Тип:
string (html|jQuery selector) | object (DOM node|jQuery object)
Некоторые примеры кода
$(document).ready(function(){
$('.slick-carousel-1').slick({
// @type {string} html
nextArrow: '<button class="any-class-name-you-want-next">Next</button>',
prevArrow: '<button class="any-class-name-you-want-previous">Previous</button>'
});
$('.slick-carousel-2').slick({
// @type {string} jQuery Selector
nextArrow: '.next',
prevArrow: '.previous'
});
$('.slick-carousel-3').slick({
// @type {object} DOM node
nextArrow: document.getElementById('slick-next'),
prevArrow: document.getElementById('slick-previous')
});
$('.slick-carousel-4').slick({
// @type {object} jQuery Object
nextArrow: $('.example-4 .next'),
prevArrow: $('.example-4 .previous')
});
});
Небольшая заметка по стилю
Как только Слик знает о ваших новых кнопках, вы можете оформить их в соответствии с вашим сердцем; глядя на приведенный выше пример, вы можете настроить таргетинг на них по имени class
, id
или даже по element
.
Если вы хотите использовать значки из любой библиотеки шрифтов значков, вы можете попробовать это в опции при вызове слайдера в вашем js-файле.
prevArrow: '<div class="class-to-style"><span class="fa fa-angle-left"></span><span class="sr-only">Prev</span></div>',
nextArrow: '<div class="class-to-style"><span class="fa fa-angle-right"></span><span class="sr-only">Next</span></div>'
Здесь «fa» происходит из библиотеки шрифтов значков FontAwesome.
Если вы используете Bootstrap 3, вы можете использовать Глификоны.
.slick-prev:before, .slick-next:before {
font-family: "Glyphicons Halflings", "slick", sans-serif;
font-size: 40px;
}
.slick-prev:before { content: "\e257"; }
.slick-next:before { content: "\e258"; }
Почему вы не можете использовать классы CSS по умолчанию и добавить свой стиль?
.slick-next {
/*my style*/
background: url(my-image.png);
}
и
.slick-prev {
/*my style*/
background: url(my-image.png);
}
Использовали ли вы простое background css свойство?
в примере: http://jsfiddle.net/BNvke/1/
Вы также можете использовать Font Awesome . Не забывайте о псевдоэлементах CSS.
И не забывайте jQuery, вы можете заменить элементы, добавить классы и т. Д.
Если вы используете sass, вы можете просто установить указанные ниже переменные для использования значков, предоставленных другими шрифтами,
$slick-font-family:FontAwesome;
$slick-prev-character: "\f053";
$slick-next-character: "\f054";
. Это изменит семейство шрифтов, используемых темой css slick, а также юникод для prev и следующая кнопка В этом примере будут использоваться значки шеврона-слева и шеврона-справа от FontAwesome.
Другие переменные sass, которые можно настроить, приведены на странице Slick Github
.Это работало для меня, когда многие из этих других предметов не:
.slick-prev:before {
content: url('your-arrow.png');
}
.slick-next:before {
content: url('your-arrow.png');
}
Это потому, что они используют значок шрифта для кнопок. Они используют шрифт «Slick», как вы можете видеть на этом изображении:
В основном, сделать букву «А» в виде значка, буквы » Б »форма другого и т. Д.
Например:
Если вы хотите узнать больше о шрифтах значков , нажмите здесь
Если вы хотите изменить значки, вам нужно заменить весь код кнопки или вы можете перейти на www.fontastic.me и создать свой собственный значок шрифта. После этого замените файл шрифта на текущий, и у вас появится собственный значок.
это очень просто. Используйте приведенный ниже код, это работает для меня. Здесь я использовал fontawesome icon, но вы можете использовать что угодно как изображение или любой другой код Icon.
$(document).ready(function(){
$('.slider').slick({
autoplay:true,
arrows: true,
prevArrow:"<button type='button' class='slick-prev pull-left'><i class='fa fa-angle-left' aria-hidden='true'></i></button>",
nextArrow:"<button type='button' class='slick-next pull-right'><i class='fa fa-angle-right' aria-hidden='true'></i></button>"
});
});
Вариант ответа @tallgirltaadaa, нарисуйте свою кнопку в форме каретки:
var a = $('.MyCarouselContainer').slick({
prevArrow: '<canvas class="prevArrowCanvas a-left control-c prev slick-prev" width="15" height="50"></canvas>',
nextArrow: '<canvas class="nextArrowCanvas a-right control-c next slick-next" width="15" height="50"></canvas>'
});
function drawNextPreviousArrows(strokeColor) {
var c = $(".prevArrowCanvas")[0];
var ctx = c.getContext("2d");
ctx.clearRect(0, 0, c.width, c.height);
ctx.moveTo(15, 0);
ctx.lineTo(0, 25);
ctx.lineTo(15, 50);
ctx.lineWidth = 2;
ctx.strokeStyle = strokeColor;
ctx.stroke();
var c = $(".nextArrowCanvas")[0];
var ctx = c.getContext("2d");
ctx.clearRect(0, 0, c.width, c.height);
ctx.moveTo(0, 0);
ctx.lineTo(15, 25);
ctx.lineTo(0, 50);
ctx.lineWidth = 2;
ctx.strokeStyle = strokeColor;
ctx.stroke();
}
drawNextPreviousArrows("#cccccc");
, затем добавьте css
.slick-prev, .slick-next
height: 50px;s
}