JavaScript將切片圖像自動添加到div

Im新的到stackoverflow，真的希望你們能幫助我。我爲一位攝影師設計了一個小型網站，他不太可能爲他的圖片下載選項。我知道沒有辦法在網上保護圖像。（您可以輕鬆保存頁面並獲取所需的一切）。 如果有更好的方法。請讓我知道.. 所以無論如何我說我會切片他的圖片和上傳，所以人們將只下載他的形象片。即使它不是100％安全的，經過幾個解釋時間後，他仍然可以使用它:) 我一直希望使用SuperSimple圖像拼貼，但由於它運行php很多，它加載圖像有點慢。我確定，你們知道這件事。因此，無論如何，現在我希望使用批量圖像切片機和切片圖像。哦，我忘了告訴，有大約100個圖像：D 因此無論如何，我會平等地將一張圖片切成25張（5x5）。我將在div中添加完整的圖像。我需要知道的是，是否需要使用js循環添加切片圖像，以便該過程更平滑和簡單。由於div會根據熨平板尺寸調整大小，因此完整的圖像應該在100％的寬度和高度。JavaScript將切片圖像自動添加到div

這是當前的完整圖像語法。

<div> <img src="IMAGE (1).jpg" width="100%" height="100%" /> </div>

我想要做的是，而不是上面的圖像標籤，我需要運行一個循環腳本。添加25張圖片（而不是1張圖片來製作圖片）。圖像被命名爲圖像（1）1，圖像（1）2，圖像（1）3..etc ..直到圖像（1）25和再次圖像（2）1，圖像（2）2，圖像2）3..etc ..直到圖像（2）25 ...

希望我解釋了我的問題。請有人讓我知道一個簡單的方法來添加一個腳本來自動化圖像插入過程。我相信圖像風格應該是FLOAT = LEFT和WIDTH = 20％和HEIGHT = 20％..

非常感謝。

來源

2013-07-05 user2553312

我使用的技巧是使用收到一個「半加密後」竟是rotate13（移動每個字母的字母表13個字母的簡單閃光的容器，這樣再次將轉換回正常）並使用它來查找圖像並顯示它。所以人們不能只是點擊右鍵並保存爲...但它絕對不會100％安全。 – Salketer

使用PHP會更好一個重要的原因：不是每個人都啓用了JavaScript。我不熟悉'SuperSimple圖像瓷磚'，所以我不能評論其性能，但普通的PHP不會減慢比較 - 在大多數情況下，它應該比類似的JavaScript循環快，只是由於它的事實是在較少的數據下載到客戶端。

爲了做到這一點在純PHP（假設在初始變量和闡明的圖像塊編號從0開始）：

<?php 
$img_path = "images/funkytree_" //the base image path without the number or the extension 
$img_ext = ".jpg" //the extension 
$img_alt = "funky tree" //alt text for the images 
$i = 0; 
while ($i < 25) { 
echo "<img src='{$img_path}{$i}{$img_ext}' alt='{$img_alt}'/>; 
$i ++; 
} 
?>

然後最好是使用CSS樣式來設置位置/大小的每個圖像。

HTH 尼克

來源

2013-07-06 07:16:35

JavaScript將切片圖像自動添加到div

回答

相關問題