如何创建可嵌入图像

发布于 2024-10-22 06:54:45 字数 453 浏览 2 评论 0原文

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

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

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

I am developing a site that encourages other bloggers to take a image and post it in their blog. More or less advertisements. I want to be able to develop a page that has a series of images with an embed code below them, so users can copy the html embed code and paste it into their files.

Typically, I would just send the image, or provide users with the actual image link ( eg: http://sitenamehere.com/images/ad.jpg ) but I think there is a much better way of letting site visitors securely embed content from my site to theirs. In this case, it will just be embeddable gifs or jpgs. Are there any great tools or services out there to help with this subject?

Upon review, this seems like a dumb question because a simple image path would suffice...but perhaps there are tools that generate textareas with the code pre-inserted in them for easy copy/paste...Any suggestions? Jquery solutions encouraged!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

想念有你 2024-10-29 06:54:45

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

you can do something using a jquery dialog:

$('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
})

or something like that to display the embed url to your users :-)

青衫负雪 2024-10-29 06:54:45
$(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));
    });
});

将您的图像指定为“广告”类别,然后就完成了!
您将得到一个带有值的小输入字段:
SITENAME

$(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));
    });
});

give your images the class 'advertisements' and you're done!
You will get a small inputfield with value:
<a href="YOURSITE"><img src="THE SRC OF THE IMG" alt="SITENAME"></a>

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文