Хотя это можно взломать с помощью регулярного выражения (и мне нравится злоупотреблять регулярными выражениями так же, как и следующий парень), вы рано или поздно столкнетесь с проблемой обработки подстрок без более продвинутого синтаксического анализатора. Возможные способы попадания в проблему включают смешанные кавычки и экранированные кавычки.
Эта функция разделяет строку на запятую, но не те запятые, которые находятся внутри строки с одним или двумя кавычками. Его можно легко расширить с помощью дополнительных символов для использования в качестве кавычек (хотя для пар символов, таких как «», потребуется еще несколько строк кода), и даже скажет вам, если вы забыли закрыть цитату в своих данных:
function splitNotStrings(str){
var parse=[], inString=false, escape=0, end=0
for(var i=0, c; c=str[i]; i++){ // looping over the characters in str
if(c==='\\'){ escape^=1; continue} // 1 when odd number of consecutive \
if(c===','){
if(!inString){
parse.push(str.slice(end, i))
end=i+1
}
}
else if(splitNotStrings.quotes.indexOf(c)>-1 && !escape){
if(c===inString) inString=false
else if(!inString) inString=c
}
escape=0
}
// now we finished parsing, strings should be closed
if(inString) throw SyntaxError('expected matching '+inString)
if(end<i) parse.push(str.slice(end, i))
return parse
}
splitNotStrings.quotes="'\"" // add other (symmetrical) quotes here
Вы должны иметь возможность центрировать свой элемент видеооболочки, просто задав ему динамические поля:
<styles>
#video {
padding-bottom: 55%;
position: relative;
padding-top: 30px;
height: 0;
overflow: hidden;
margin-top: 50px;
/*display item as block element */
display: block;
/* align left and right margins dynamically throwing you right in the middle */
margin-left: auto;
margin-right: auto
/* width and/or max-width must tell us how big video wrapper can really be */
width: 100%;
max-width: 500px;
}
</styles>
Если ваше видео по-прежнему не центрировано, то это означает, что его родительский элемент имеет неверную ширину .
#video embed {
position: absolute;
top: 0;
left: 0;
width: 60%;
height: 60%;
}
Кому:
#video embed {
position: absolute;
top: 0;
left: 0;
right: 0;
width: 60%;
height: 60%;
margin: 0 auto;
}
Замените следующий код CSS
#video iframe,
#video object,
#video embed {
position: absolute;
top: 0;
left: 0;
width: 60%;
height: 60%;
}
этим
#video iframe,
#video object,
#video embed {
position: absolute;
left: 50%;
right: 50%;
transform: translateX(-50%);
width: 60%;
height: 60%;
}