如何创建可嵌入图像

时间:2011-03-15 21:12:50

标签: jquery image embed

我正在开发一个网站,鼓励其他博主拍摄图片并将其发布在他们的博客中。或多或少的广告。我希望能够开发一个页面,其中包含一系列带有嵌入代码的图像,因此用户可以复制html嵌入代码并将其粘贴到文件中。

通常,我只是发送图片,或者为用户提供实际的图片链接(例如:http://sitenamehere.com/images/ad.jpg),但我认为有一种更好的方式让网站访问者可以安全地将网站内容嵌入他们的网站。在这种情况下,它只是可嵌入的GIF或jpgs。有没有很棒的工具或服务来帮助解决这个问题?

经过审核,这似乎是一个愚蠢的问题,因为一个简单的图像路径就足够了......但是也许有一些工具可以生成textareas,并在其中预先插入代码以便于复制/粘贴...任何建议?鼓励Jquery解决方案!

2 个答案:

答案 0 :(得分:2)

您可以使用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
})

或类似的东西,以向您的用户显示嵌入网址: - )

答案 1 :(得分:0)

$(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>