使用谷歌應用程序腳本創建超鏈接圖像

我一直在試圖把超鏈接的圖像放到谷歌應用程序腳本用戶界面中。我首先想到了使用createAnchor（），但只允許使用文本。然後我想到了使用按鈕，但據我所知，無法打開新的選項卡/窗口並在回調函數中重定向。使用谷歌應用程序腳本創建超鏈接圖像

我也試過createHTML（），但是元素還沒有被它處理。

我已經看到人們在圖像上覆蓋了透明按鈕，但在回調中仍然存在相同的問題。

我的研究尚未找到答案。有沒有人有任何解決方案/例子？

感謝

來源

2012-05-29 ChrisG

-1

如果先創建一個字符串所有的HTML，然後你可以替換的HTML頁面的內容，你想是這樣的：

var myString = 'the html you want to add, for example you image link and button'; 
var page = SitesApp.getSite('example.com', 'mysite').getChildByName('targetpage'); 
var upage = page.setHtmlContent('<div>' + myString + '</div>');

來源

2012-05-29 09:57:49 Spithout

HTML小部件不支持鏈接或圖像。 –

button.setStyleAttribute（「background」，「url（image.JPG）no-repeat」）;在Chrome上工作，但不顯示在IE上。但即使有這個問題，它確實會超過透明IE按鈕的點擊問題。 – eddyparkinson

我不相信這可用的小部件可用。我會建議改變你的用戶界面的設計，以利用錨點小部件。

來源

2012-05-30 17:05:30

如果您直接在頁面上編碼，請使用HTML框。點擊「編輯」編輯您的頁面，然後轉到菜單中的「插入> HTML框」。它也會接受JavaScript！有一些注意事項 - 當使用javascript時，HTML Box不會接受鏈接......太糟糕了，但是太多的漏洞利用了。

如果您在應用程序腳本中進行編碼，您可以嘗試將圖像放在面板上並使用絕對面板並將鏈接放在圖像上。另一種方法可以是使用.setStyleAttribute CSS樣式和利用zIndex的參數放置在面板圖片上方....像這樣：

var panel = app.createSimplePanel(); 
// add your image to the simple panel or whatever panel you wish to choose in your GUI 

var popPanel = app.createSimplePanel() 
    .setStyleAttribute('top','Y') 
    .setStyleAttribute('left','X') 
    .setStyleAttribute('zIndex','1') 
    .setStyleAttribute('position','fixed'); 
// add your anchor to the popPanel 

app.add(panel).add(popPanel);

不是100％肯定，如果你可以讓這個面板透明的，但你可以嘗試這樣的： .setStyleAttribute（「背景」，透明「）或通過更改不透明度： .setStyleAttribute（」不透明」，‘5’）

希望，這給你一個數想法！

來源

2012-05-31 02:52:41 tiampen

這爲我工作在Chrome20和IE9

 // Container for box and results 
     var imageContainer = app.createFlexTable(); 


     // Setup the button 
     var button = app.createButton("ImageButton"); 
     button.setStyleAttribute("background", "url(dontshowimagehere.JPG) no-repeat"); 
     button.setStyleAttribute("position", "absolute"); 
     button.setStyleAttribute("color", "transparent"); 
     button.setStyleAttribute('zIndex','1'); 
     button.setStyleAttribute("border", "0px solid black"); 



     imageContainer.setWidget(0, 0, button); 

     // image to click 
     var image = app.createImage("image.jpg").setId(imageId); 

     imageContainer.setWidget(1,0, image);

的圖像有輕微的（3px的）所抵消。如果重要，這看起來要修復它http://www.w3schools.com/css/css_positioning.asp（使用相對於flex表和頂部等圖像和按鈕）

來源

2012-07-09 03:28:34 eddyparkinson

你試過一個透明的錨覆蓋圖像？

function doGet() { 
var app = UiApp.createApplication().setTitle("Image Anchor"); 
var panel = app.createAbsolutePanel().setWidth('50%').setHeight('50%'); 
var image = app.createImage().setUrl("https://lh6.googleusercontent.com/-v0Q3gPQz03Q/T_y5gcVw7LI/AAAAAAAAAF8/ol9uup7Xm2g/s512/GooglePlus-512-Red.png").setStyleAttribute("width", "28px").setStyleAttribute("height", "28px"); 
var anchor = app.createAnchor("?", "https://plus.google.com/u/1/116085534841818923812/posts").setHeight("28px").setWidth("28px").setStyleAttribute("opacity", "0.1").setTarget("blank"); 
panel.add(image,100,50); 
panel.add(anchor,100,50); 
app.add(panel); 
return app.close(); 
}

來源

2012-11-17 02:19:23 Jacobvdb

app.createAbsolutePanel（）。新增（app.createImage（ 'https://www.google.com/images/logos/google_logo_41.png '））。新增（app.createAnchor（''，」 https://www.google.co.uk/intl/en/about/ '） .setStyleAttributes（{位置：'絕對'，頂部：'0px'，左'：0px'，寬度：'201px'，高度：'47px'，不透明度：'0'}））

這是一個測試過的。它工作正常。它不適用於定位圖像（如'絕對'）。它不適用於.setHorizontalAlignment（UiApp.HorizontalAlignment。中心）

來源

2013-04-21 11:47:57 Richi

我設法做一個單一的錨對象和使用CSS3。它適用於Chrome，我沒有在其他瀏覽器中測試它。

gui.createAnchor("", false, "$DESTINATION_URL$") 
    .setStyleAttributes({ "display":"block", 
         "width":"$IMAGE_WIDTH_IN_PIXEL$", 
         "height":"$IMAGE_HEIGHT_IN_PIXEL$", 
         "background":"url($URL_OF_THE_IMAGE$)", 
         "background-size":"100% 100%", 
         "background-repeat":"no-repeat" })

當然，您必須將$ ...... $替換爲您的數據。

Thierry

來源

2014-06-18 10:42:35

使用谷歌應用程序腳本創建超鏈接圖像

回答

相關問題