2012-06-22 135 views
0

我試圖在radio-play.gif按鈕的左側放置一些空間。什麼可以添加到此代碼來實現呢?在圖像之前添加空格,javascript

謝謝!

// Last (only one on Mac) row has the VCR buttons. 
// 
s += '<td>'; 
s += '<img border="0" src="/images/dot.gif" width="81" height="' + gPreBtnVertSpace + '"><br>'; 
s += '<img alt="PLAY" src="' + imageDir + 'radio-play.gif" width="72" border="0" padding="5" height="61" style="cursor:pointer; cursor:hand" onclick="HandleAction(\'playnow\')">'; 

if (player != 'MP3') 
    s += '<img alt="STOP" src="' + imageDir + 'radio-stop.gif" width="72" border="0" height="61" style="cursor:pointer; cursor:hand" onclick="HandleAction(\'stop\')">'; 

s += '</td></tr>'; 

document.write(s); 

// removing mute button 
var myEl = document.getElementsByName("mute"); 
var elP = myEl[0].parentNode.parentNode; 
elP.removeChild(myEl[0].parentNode); 
+0

'document.write()'是差的形式(DOM的純文本操作一般來說)。另外,我正在尋找一個JavaScript生成的頁面佈局HTML表格?!現在是2012年,CSS可以做得更快,更清潔,更輕鬆,更安全......更好。 – user268396

回答

2

要麼設置緣至img標籤(它需要display:inline-block;此)或添加 一個&nbsp;(未見破損空間)。

可能是我的首選方法,例如,

img{ 
    display:inline-block; 
    margin-left:5px; 
} 

s += '&nbsp;<img alt="PLAY" ... 

順便說一句。:正確的方法是,創建通過document.createElement<td><img>元素,然後將它們連接到DOM。 (或使用jquery,這有點簡單)

1

你可以從字面上把它的一個空格字符。我會用CSS來做。給圖像類class="whatever",然後在CSS:

.whatever { 
    margin-left: 10px; 
} 

既然你這樣做已經內嵌,你可以只添加保證金的內聯CSS。

+0

需要是應用邊距的塊元素 – Christoph

+0

http://jsfiddle.net/WWh4u/ – sachleen

+0

圖像有一些特殊待遇,因爲它們是被替換的元素,但是規則仍然認爲內聯元素不能應用邊距。 – Christoph

0
s += '&nbsp;<img alt="PLAY" src="' + imageDir + 'radio-play.gif" width="72" border="0" padding="5" height="61" style="cursor:pointer; cursor:hand" onclick="HandleAction(\'playnow\')">'; 

,或者更正確,

s += '&nbsp;<img alt="PLAY" src="' + imageDir + 'radio-play.gif" width="72" border="0" padding="5" height="61" style="cursor:pointer; margin-left:5px;" onclick="HandleAction(\'playnow\')">'; 
0

如果「空間」是指在視覺上呈現的空間來渲染按鈕元素的左邊,這通常是用CSS來完成。一個常見的實現是圖像標籤本身或圖像標籤的容器具有適當分配空間的CSS類屬性。對於CSS來做這件事,看看像填充,邊距,絕對與相對定位,leftright屬性等東西。