Üye Girişi
Bağlan Google+ ile Bağlan Facebook ile Bağlan
Yeni Kayıt
Tüm Forumlar
  • Tüm Forumlar
  • Web Tasarım - Programlama
  • Tasarım ve grafik
  • Web Tasarım ve Hazır Kodlar
  • Bu Konuda
Şimdi Ara

java script eklemek

Sıcak Fırsatlarda Tıklananlar
Editörün Seçtiği Fırsatlar
Bu Konudaki Kullanıcılar:
2 Misafir - 2 Masaüstü
5 sn
4
Cevap
0
Favori
5.596
Tıklama
Daha Fazla
İstatistik
  • Konu İstatistikleri Yükleniyor
Konuya Özel
0 oy
Öne Çıkar
Cevapla
Sayfa: 1
Giriş
Mesaj
  • Dreamweaver da bi web sitesi hazırladım ama bikaç java script eklemek istiyorum.Kodları web'den buldum ama nasıl eklemeliyim bilmiyorum.Bilen varsa yardımcı olurmusunuz bana??



  • dreamweaverde siteni aç.( muhtemelen index.html dir)
    code agir ve ekleyeceğin javasciptleri sayfa düzenine uygun ki biyere yerleştir
    Not: konuyu yanlış yere açmısın. tasarım bölümüne yeniden aç daha faydalı olabilir.
  • Java kodlarını nereye nasıl yazacağınızdan önce Java Scriptler ve türevleri hakkında biraz bilmgi verelim ki her türlü scriptin aynı şekilde yerleştirildiğini zannedebilir ve daha sonrası için hata yapabilirsiniz.

    Genelde Java Script örneklerinde Java kodlarının arasında nerelere yazılması gerektiği anlatılır.

    1- Head Tagları arasına yazılması gerekenler.

    Bildiğimiz gibi Doctype haricinde sayfa ne olursa olsun ( asp - php vs ) sayfa tarayıcıda görüntülenirken ilk tag Html daha sonra head dır.
    Head arasına yazılması gereken diye açıklanan kısım
    <head> </head> arasına herhanngi bir yere yazılabilir. ( Script yazım kurallarına uygun biçimde )
    Head tagları arasına yazılan scriptler genelde saygfanın genel işleyişi yada sayfa içinde yine başka bir java Script kodunun doğru bir şekilde çalışmasını ve/veya Java Fonksiyonun kod kısmını içerir. bazı durumlarda bu kod yerine ".js" dosyası da kullanılır. Aslında uygulanan genel method java script komutları çok uzun ise bunları .js olarak verilerek ilgili js dosyasının linki verilir. ( Aynen Css dosyalarında olduğu gibi. ) Dolayısı ile MoofX, Light Box, Ajax gibi genel java uygulamalarında her sayfaya ayrı ayrı yazmaktansa referans linkler yazılır.

    Peki head tagları arasına yazmamız gereken kod halindeki tüm java komutlarını js dosyası haline getirebilirmiyiz. Evet. Ve aslında çok basittir. 

    <script type="text/javascript"> 
       
      var ie=document.all 
      var ns6=document.getElementById&&!document.all 
       
      function ietruebody(){ 
      return (document.compatMode && document.compatMode!="BackCompat" && !window.opera)? document.documentElement : document.body 
      } 
       
      function enlarge(which, e, position, imgwidth, imgheight){ 
      if (ie||ns6){ 
      crossobj=document.getElementById? document.getElementById("showimage") : document.all.showimage 
      if (position=="center"){ 
      pgyoffset=ns6? parseInt(pageYOffset) : parseInt(ietruebody().scrollTop) 
      horzpos=ns6? pageXOffset+window.innerWidth/2-imgwidth/2 : ietruebody().scrollLeft+ietruebody().clientWidth/2-imgwidth/2 
      vertpos=ns6? pgyoffset+window.innerHeight/2-imgheight/2 : pgyoffset+ietruebody().clientHeight/2-imgheight/2 
      if (window.opera && window.innerHeight) //compensate for Opera toolbar 
      vertpos=pgyoffset+window.innerHeight/2-imgheight/2 
      vertpos=Math.max(pgyoffset, vertpos) 
      } 
      else{ 
      var horzpos=ns6? pageXOffset+e.clientX : ietruebody().scrollLeft+event.clientX 
      var vertpos=ns6? pageYOffset+e.clientY : ietruebody().scrollTop+event.clientY 
      } 
      crossobj.style.left=horzpos+"px" 
      crossobj.style.top=vertpos+"px" 
       
      crossobj.innerHTML='<div align="right" id="dragbar"><span id="closetext" onClick="closepreview()">Close</span> </div><img src="'+which+'">' 
      crossobj.style.visibility="visible" 
      return false 
      } 
      else //if NOT IE 4+ or NS 6+, simply display image in full browser window 
      return true 
      } 
       
      function closepreview(){ 
      crossobj.style.visibility="hidden" 
      } 
       
      function drag_drop(e){ 
      if (ie&&dragapproved){ 
      crossobj.style.left=tempx+event.clientX-offsetx+"px" 
      crossobj.style.top=tempy+event.clientY-offsety+"px" 
      } 
      else if (ns6&&dragapproved){ 
      crossobj.style.left=tempx+e.clientX-offsetx+"px" 
      crossobj.style.top=tempy+e.clientY-offsety+"px" 
      } 
      return false 
      } 
       
      function initializedrag(e){ 
      if (ie&&event.srcElement.id=="dragbar"||ns6&&e.target.id=="dragbar"){ 
      offsetx=ie? event.clientX : e.clientX 
      offsety=ie? event.clientY : e.clientY 
       
      tempx=parseInt(crossobj.style.left) 
      tempy=parseInt(crossobj.style.top) 
       
      dragapproved=true 
      document.onmousemove=drag_drop 
      } 
      } 
       
      document.onmousedown=initializedrag 
      document.onmouseup=new Function("dragapproved=false") 
       
      </script>


    Bu kod bir Java fonksiyonu için head tagları arasına yazılması gerekiyor. Oldukça uzun sayılabilir. biz bu kodu notepad dosyasının içine kopyalayıp başlardaki

    <script type="text/javascript"> ve en sondaki kapatma tagını çıkartıp ( </script> ) xxx.js olarak kaydeder isek otomatikman bu dosyayı bir js dosyası haline getirmiş oluruz.

    Ve daha sonra
    <script type="text/javascript" src="xxx.js"></script>
    yazarak kodu sayfada yine işletmiş oluruz.
    Spesifik bazı uygulamalarda bu tip js dosyaları farklı sayfalar için kullanamayabiliriz. bunun nedeni js dosyasının içinde bir image adı gibi bir sayfa için kullanılacak işlemlerde sağlıklı sonuçlar alamayabiliriz.
    Not 1 : Aslında kullanılabilir ama biraz daha profosyenel bir bilgi gerektirecektir.
    Not 2 : Java kodlarını Js dosyasına çevirir isek mutlaka içerisindeki hedef yol paremetrelerine dikkat ediniz. Özellikle Js dosyalarını ayrı bir klasör içinde topluyor iseniz.

    2 - Body Tagları içinde olan kısım.

    Aslında bu kısım sadece kısıtlı bir fonksiyonu yada aslında head tagları içerisine yazılmış fonksiyonları tamamlayıcı ve görüntüleyici kodlardır. Zaten bir çoğu onload, onmouseover, Javascript:void(0); gibi komutlar içerir, yada div gibi tagların içerisinde menü, yada efect yada popup gibi pencerelerin içeriğini oluşturabilir.
    Not : Burada bahsedilen Popup aslında kendiliğinden açılan ayrı bir sayfa gibi olarak düşünmeyin. Scrol duyarlı kayan menüler, dropdown menüler ve genelde imagelara verilen efectler gibi.

    Birde Body tagları arasında sadece kendileri başlı başına işlev oluşturan kodlar da yazılabilir. Genelde bu tip kodları nereye ( Body Tagları arasında ) yazdığınızın bir önemi yoktur. Çünkü sayfanın belirli bir bölümünde görüntülenmezler. Status bar yazıları ve yine 3 aşamadan oluşan ve sadece onload görevi yapan Java Fonksiyonları gibi kodların genelde sayfanın en sonuna body tagını hemen kapatmadan önce yazılabilir.

    Not ** : Bazı durumlarda sayfa içerisinde birden çok onload fonksiyonu var ise lütfen kodları yayınlayan kişi/sitelerin uyarılanı dikkate alınız. Aksi takdirde her iki fonksiyon da çalışmayabilir.

    Menü ve buna benzer saat, tarih gibi işlevlerin mutlaka sayfada nerede gözükmesi gerekiyor ise o kısımlara yazılması gerekiyor. Buda zaman zaman tasarım yada kodların kullanışlığı açısından sorun yaratabilir. Bu durumda sayfa içerisinde bazı değişiklikler yapmanız gerekebilir. Eğer sorunu kolay olarak halletmek istiyorsanız "Table Layout" yada "Div" taglarından yardım alabilirsiniz.

    Not ** : Yine Java ile yaptığınız Menülerin genel yapılış tarzı <ul> <il> kodları ile yapıldığından İlgili WYSIWYG ( What You see is what you get ) tarzı tasarım programlarında yani Frontpage ve Dreamweaver tarzı programlarda menüler alt alta sıralanmış bir şekilde gözükebilir. Gözüktüğü hali ile tasarımınız yani tablo ve hücrelerinizin kaydığını görebilirsiniz. Bunu Tasarım kısmında dikkate almayın ve mutlaka gözükecek hali için Ön İzleme yada Tarayıcıda Görüntüleme seçeneklerini kullanın.

    Açıklamalara rağmen herhangi bir kodu kullanmakta sorun yaşıyor iseniz lütfen ilgili kodları ve sayfanızın kod ve diğer dosyalarını içeren kaynağı belirterek yardım isteyebilirsiniz.




  • Aşağıdaki scripti not pad a yapıştırıp dosyaAdi.htm olarak kaydet. Scripti head /head arasına yazdık. 
       
      <html> 
      <head> 
       
      <script type="text/javascript"> 
       
      var div = document.getElementById('only_smile');  
      var inputYap = document.createElement('input'); 
      inputYap.setAttribute("type","text") ; 
      inputYap.setAttribute("value","lynx23") ; 
       
      div.appendChild(inputYap); 
      </script> 
      </head> 
      <body> 
      <div id="only_smile"></div>

    İnternet Explorer, Opera veya Mozilla'da sayfayı aç. Bembeyaz bir sayfa görüyorsan herşey yolunda demektir. Yani scriptimizin çalışmasının sonucu görünmedi.

    Şimdi de scripti body den sonraya yazalım. 
       
      <html> 
      <head> 
      </head> 
      <body> 
       
      <script type="text/javascript"> 
       
      var div = document.getElementById('only_smile'); // katmanımız 
      var inputYap = document.createElement('input'); // input yapalım 
      inputYap.setAttribute("type","text") ; // tipi metin kutusu olsun 
      inputYap.setAttribute("value","lynx23") ; // değeri lynx23 olsun 
       
      div.appendChild(inputYap); // katmana inputu ekle 
      </script> 
       
      <div id="only_smile"></div> 
       
      </body> 
      </html>

    Bu da her 3 tarayıcıda da çalışmayacaktır.
    Şimdi di scripti hem body den sonra hem de div den sonra yazalım. Bu da olmazsa bu işi bırakırız. 
       
      <html> 
      <head> 
      </head> 
      <body> 
      <div id="only_smile"></div> 
       
      <script type="text/javascript"> 
       
      var div = document.getElementById('only_smile'); // katmanımız 
      var inputYap = document.createElement('input'); // input yapalım 
      inputYap.setAttribute("type","text") ; // tipi metin kutusu olsun 
      inputYap.setAttribute("value","lynx23") ; // değeri lynx23 olsun 
       
      div.appendChild(inputYap); // katmana inputu ekle 
      </script>

    Bu kod her 3 tarayıcıda da çalışacaktır.



    < Bu mesaj bu kişi tarafından değiştirildi sanal47 -- 5 Kasım 2006; 22:02:38 >




    • 
Sayfa: 1

Benzer içerikler

- x
Bildirim
mesajınız kopyalandı (ctrl+v) yapıştırmak istediğiniz yere yapıştırabilirsiniz.
Hizmet kalitesi için çerezleri kullanabiliriz. DH’ye girerek kullanım izni vermiş sayılırsınız.
Anladım Veri Politikamız