Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Создание блока div и вставка в него iframe (https://javascript.ru/forum/misc/71618-sozdanie-bloka-div-i-vstavka-v-nego-iframe.html)

Woolf4eg 01.12.2017 10:30

Создание блока div и вставка в него iframe
 
Добрый день, имеется код вставки видео с ютюба, но оно естественно получается не адаптивным, помогите разобраться как с помощью js сделать чтобы создавался блок div и уже в него добавлялся iframe?
CKEDITOR.dialog.add("tliyoutube2Dialog",function(b){
return{
title:b.lang.tliyoutube2.title,
minWidth:400,
minHeight:200,
contents:[{
id:"tab-basic",
label:"Basic Settings",
elements:[{
type:"text",
id:"youtubeURL",
label:b.lang.tliyoutube2.txtUrl}]}],
onOk:function(){
var c=this.getValueOf("tab-basic","youtubeURL").trim().match(/v=([^&$]+)/i);
if(null==c||""==c||""==c[0]||""==c[1])return alert(b.lang.youtube.invalidUrl),!1;
var a=b.document.createElement("iframe");
a.setAttribute("width","420");
a.setAttribute("height","236");
a.setAttribute("src","//www.youtube.com/embed/"+c[1]+"?rel\x3d0");
a.setAttribute("frameborder","0");
a.setAttribute("allowfullscreen","1");
b.insertElement(a)}}});

ksa 01.12.2017 11:41

Цитата:

Сообщение от Woolf4eg
как с помощью js сделать чтобы создавался блок div и уже в него добавлялся iframe?

Как вариант...

CKEDITOR.dialog.add(
	"tliyoutube2Dialog",
	function(b){
		return {
			title:b.lang.tliyoutube2.title,
			minWidth:400,
			minHeight:200,
			contents:[{
			id:"tab-basic",
			label:"Basic Settings",
			elements:[{
			type:"text",
			id:"youtubeURL",
			label:b.lang.tliyoutube2.txtUrl}]}],
			onOk:function(){
				var c=this.getValueOf("tab-basic","youtubeURL").trim().match(/v=([^&$]+)/i);
				if(null==c||""==c||""==c[0]||""==c[1])return alert(b.lang.youtube.invalidUrl),!1;
				var odiv=document.createElement("div");
				var a=document.createElement("iframe");
				a.setAttribute("width","420");
				a.setAttribute("height","236");
				a.setAttribute("src","//www.youtube.com/embed/"+c[1]+"?rel\x3d0");
				a.setAttribute("frameborder","0");
				a.setAttribute("allowfullscreen","1");
				odiv.insertElement(a);
				b.insertElement(odiv);
			}
		}
	}
);

Woolf4eg 01.12.2017 13:01

Цитата:

Сообщение от ksa (Сообщение 471786)
Как вариант...

К сожалению не работает этот вариант.

Woolf4eg 02.12.2017 04:37

При вводе кода в окно, кнопка ОК во всплывающем окне не активна становится.

CKEDITOR.plugins.add("tliyoutube2",{
icons:"tliyoutube2",
lang:"en pt ja hu it fr tr ru de ar nl pl vi zh el he es nb nn fi et sk cs".split(" "),
init:function(a){a.addCommand("tliyoutube2Dialog",new CKEDITOR.dialogCommand("tliyoutube2Dialog"));
a.ui.addButton("tliyoutube2{
label:a.lang.tliyoutube2.button,command:"tliyoutube2Dialog",toolbar:"insert"});
CKEDITOR.dialog.add("tliyoutube2Dialog",this.path+"dialogs/tliyoutube2.js")}});


Может проблема в коде самой кнопки?

ksa 04.12.2017 09:22

Цитата:

Сообщение от Woolf4eg
К сожалению не работает этот вариант.

Без тестового примера в это не проверить... :no:


Часовой пояс GMT +3, время: 17:08.