alexa  Menu
HTML 5 indirme özelliği - download.

HTML 5 indirme özelliği – download.

  19.01.2016 ,   yorum yapılmadı ,   1.541 kez okundu.

Bazı internet sayfalarında özellikle resim / fotoğraf sitelerinde fotoğrafı indirme linklerinin bulunduğunu görmüşsünüzdür. Fotoğrafı görüntülemek tamam, fotoğrafa link vermek de kolay. Fakat Fotoğrafa link verdiğimizde üzerine tıklayınca yine aynı sayfada fotoğraf görüntüleniyor.

HTML5 ile kısacık bir kod/etiket ekleyerek fotoğraf indirme düğmesi yapmak çok kolay aslında. Yapmamız gereken sadece bir fotoğraf eklemek, fotoğrafın linkine download etiketini yazmak o kadar. Örnek olarak aşağıdaki kodları inceleyebilirsiniz:

<a href="http://www.anarsamadov.net/wp-content/themes/anar/images/logo.png">
<img src="http://www.anarsamadov.net/wp-content/themes/anar/images/logo.png" alt="logo">
</a>

Yukarıda paylaştığım kod her zaman kullandığımız fotoğraf ve fotoğrafa verilen linki belirtiyor. Bu kodu biraz daha farklı yazmak gerekirse, örneğin fotoğrafı gösterip altında fotoğraf indir yazarak indir linkine tıkladığımızda fotoğrafı direk bilgisayara indirme işlemini başlatabiliriz:

<img src="http://www.anarsamadov.net/wp-content/themes/anar/images/logo.png" alt="logo">
<br>
<a href="http://www.anarsamadov.net/wp-content/themes/anar/images/logo.png" download>fotoğrafı indir</a>

Sonuç aşağıdaki gibi olacaktır:

Kaynak: W3Schools

Yorum yapın..