• Buradasın

    HTML'de sürükle bırak nasıl yapılır?

    Yazeka

    Arama sonuçlarına göre oluşturuldu

    HTML'de sürükle bırak (drag and drop) işlemi yapmak için aşağıdaki adımlar takip edilmelidir:
    1. Elementi Sürüklenebilir Hale Getirme: 
      draggable="true"
      attribute'ü kullanarak bir elementi sürüklenebilir hale getirin 12. Örneğin: 
      <img draggable="true" src="image.png">
      1.
    2. Sürükleme Davranışını Tanımlama: Sürükleme işlemini başlatan olayı ve sürüklenecek veriyi belirlemek için 
      ondragstart
      event'ini kullanın ve bu event'te 
      drag(event)
      fonksiyonunu çağırın 13. Bu fonksiyon, 
      event.dataTransfer.setData()
      metodu ile sürüklenecek verinin tipini ve değerini ayarlar 3.
    3. Bırakma Hedefini Etkinleştirme: Sürüklenen verinin bırakılabileceği bir hedef (drop target) oluşturmak için 
      ondragover
      event'ini kullanın ve 
      event.preventDefault()
      metodu ile tarayıcının varsayılan davranışını önleyin 13. Örneğin: 
      <div ondragover="event.preventDefault()"></div>
      1.
    4. Bırakma İşlemini Gerçekleştirme: 
      ondrop
      event'ini kullanarak bırakma işlemini tamamlayın ve sürüklenen veriyi hedef alana yerleştirin 13. Örneğin: 
      <div ondrop="drop(event)"></div>
      1.
    Bu adımlar, HTML5'in sunduğu yerleşik sürükle bırak olayları sayesinde minimal kodlamayla uygulanabilir 1.
    5 kaynaktan alınan bilgiyle göre:

      Yanıtı değerlendir

      5 kaynak

      1. geeksforgeeks.org
        1
      2. linkedin.com
        2
      3. developer.mozilla.org
        3
      4. htmldersleri.org
        4
      5. upgrad.com
        5

    Konuyla ilgili materyaller

    HTML5 ile neler yapılabilir?

    HTML5 ile birçok farklı şey yapılabilir: 1. Multimedya Desteği: HTML5, yerleşik video ve ses oynatma özellikleri sunar, bu da medya içeriklerini doğrudan tarayıcıda oynatmayı sağlar. 2. Gelişmiş Formlar: E-posta, telefon ve tarih gibi giriş alanları için yeni form kontrolleri sunar, form doğrulama işlemlerini kolaylaştırır. 3. Canvas ve SVG ile Grafik Desteği: Dinamik grafikler ve animasyonlar oluşturmak için <canvas> ve vektörel grafikler için <svg> etiketleri kullanılır. 4. Yerel Depolama: Kullanıcı verilerinin tarayıcıda saklanmasını sağlar, bu da çerezlerden daha güvenli ve geniş kapsamlı bir depolama imkanı sunar. 5. Responsive Tasarım: Media queries ve diğer araçlar ile farklı ekran boyutlarına ve cihaz türlerine uygun web sayfaları geliştirmeyi mümkün kılar. 6. Oyun Geliştirme: Web tabanlı oyunlar geliştirmek için popüler bir platformdur, Canvas ve WebGL gibi teknolojiler kullanılır. 7. Zengin Medya Uygulamaları: Online video platformları, ses oynatıcıları ve medya galerileri gibi uygulamalar geliştirmek için kullanılır.
    5 kaynak

    HTML ile neler yapılabilir?

    HTML (Hypertext Markup Language) ile aşağıdaki işlemler yapılabilir: 1. Web sayfalarının yapısını oluşturmak: Başlıklar, paragraflar, listeler, tablolar ve diğer öğeler HTML etiketleri kullanılarak yapılandırılır. 2. Metin ve görselleri yerleştirmek: <img> etiketi görselleri, <video> etiketi videoları eklemek için kullanılır. 3. Bağlantılar oluşturmak: <a> etiketi ile web sayfaları arasında veya farklı sitelere bağlantılar oluşturulur. 4. Formlar oluşturmak: Kullanıcı girdilerini almak için formlar oluşturulur, bu formlar sunucuya veri gönderir. 5. SEO ve erişilebilirlik: Doğru etiketler ve yapılandırmalar kullanarak arama motoru optimizasyonu ve erişilebilirlik sağlanır. 6. CSS ve JavaScript ile entegrasyon: HTML, web sayfalarının stilini ve dinamik işlevselliğini CSS ve JavaScript ile birlikte kullanır.
    5 kaynak