Как создать встраиваемые изображения - PullRequest
Новая
       17

Как создать встраиваемые изображения

0 голосов
/ 16 марта 2011

Я занимаюсь разработкой сайта, который побуждает других блоггеров делать снимки и публиковать их в своем блоге. Более или менее реклама. Я хочу иметь возможность разработать страницу с серией изображений с кодом для встраивания под ними, чтобы пользователи могли скопировать html-код для встраивания и вставить его в свои файлы.

Как правило, я просто отправляю изображение или предоставляю пользователям фактическую ссылку на изображение (например: http://sitenamehere.com/images/ad.jpg), но я думаю, что есть гораздо лучший способ позволить посетителям сайта безопасно встраивать контент с моего сайта в у них. В этом случае это будут просто встраиваемые gif или jpgs. Есть ли какие-нибудь замечательные инструменты или услуги, чтобы помочь с этим предметом?

После рассмотрения это кажется глупым вопросом, потому что достаточно простого пути к изображению ... но, возможно, существуют инструменты, которые генерируют текстовые области с предварительно вставленным в них кодом для простого копирования / вставки ... Есть предложения? Решения Jquery приветствуются!

Ответы [ 2 ]

2 голосов
/ 16 марта 2011

вы можете сделать что-нибудь, используя диалог jquery: 

$('img').click(function(){
   var htmlText = 'To embed use url: '+$(this).attr('src');
   $('<div>').dialog({
      modal: true,
      beforeClose: function(){ $(this).remove(); }
   }).html(htmlText);
}).hover(function(){
   //use some tooltip to show that you can click to see embed
})

или что-то в этом роде для отображения URL-адреса встраивания для ваших пользователей: -)

0 голосов
/ 16 марта 2011 
$(document).ready(function() {
    $('img.advertisements').each(function() {
        $('<input type="text"></input>').val('<a href="YOURSITE"><img src="'+$(this).attr('src')+'" alt="SITENAME"></a>').bind('click', function() {
            $(this).focus();
        }).insertAfter($(this));
    });
});

присвойте своим изображениям класс "реклама", и все готово! Вы получите небольшое поле ввода со значением: <a href="YOURSITE"><img src="THE SRC OF THE IMG" alt="SITENAME"></a>

...