Şimdi Ara

Resmi yazının arkasında bırakarak kaydırmak

Bu Konudaki Kullanıcılar:
2 Misafir (1 Mobil) - 1 Masaüstü1 Mobil
5 sn
7
Cevap
0
Favori
380
Tıklama
Daha Fazla
İstatistik
  • Konu İstatistikleri Yükleniyor
0 oy
Öne Çıkar
Sayfa: 1
Giriş
Mesaj
  • aşağıda basit bir sayfa kodu var. ben bu köşedeki resmin yazının (aslında üzerindeki her türlü öğenin) arkasında kalsın istiyorum. benim yazdığım kodları .html yapıp bakarsanız, fare ile birlikte aşağıya indiğinizde yani sayfayı aşağıya çektiğinizde resmin de sürüklendiğini görürsünüz.(position:fixed) benim istediğim şey resmin yazının (ve üzerinde herhangi bir öğenin) üzerinde değil de arkasında kalarak kayması. nasıl yapabilirim?


     

    <html>

    <head>

    <style>

    #resim {
    position:fixed ;
    width:200px;
    height:200px;
    }

    </style>

    </head>

    <body>

    <img id="resim" src="https://encrypted-tbn2.google.com/images?q=tbn:ANd9GcRNscFNcMIGzXZn7d9sG-UZBHcliFpBEus8wa_HnrDJSai1gi8WuQ" />

    <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse dictum eleifend ante vitae dictum. Nulla facilisi. Ut imperdiet arcu quis tortor molestie sagittis. Vivamus commodo ullamcorper nunc, a ultricies nisl eleifend nec. Etiam in nisl eget dui iaculis iaculis sed a nibh. Cras tempor felis a nunc facilisis lacinia. Sed aliquet porta tortor eget pulvinar. Nunc accumsan suscipit eleifend. Mauris laoreet, quam quis aliquet facilisis, nulla leo feugiat purus, aliquet vehicula ante mi eget nunc. Praesent convallis velit vel nunc luctus pretium. Praesent nec erat mauris, sed hendrerit diam. Nunc ullamcorper cursus elit, eu dapibus leo aliquam euismod. Aliquam quis diam erat. In hac habitasse platea dictumst.

    Donec odio dui, porta non imperdiet a, viverra a quam. Maecenas feugiat sodales quam, id ultrices augue feugiat cursus. Ut ultricies bibendum velit, quis ultricies massa dictum sit amet. Aenean sit amet tellus nulla, in scelerisque metus. Suspendisse et nisi turpis. Vestibulum vitae risus mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. In nisl neque, venenatis et sollicitudin id, iaculis a nisi. Integer elit justo, faucibus sit amet fermentum id, volutpat sed dolor.
    <br />
    <br />
    Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam varius gravida lectus. Nulla facilisi. In id turpis et risus elementum egestas at ac tortor. Donec mollis dapibus sem ut tincidunt. Nulla facilisi. Donec eget augue est, sit amet porta tellus. Donec ac sapien in lacus tempus consequat. Vivamus blandit diam vel dui bibendum dictum. Suspendisse consectetur sagittis enim id ultricies. Sed non eros et nibh rutrum blandit ac at turpis. In hac habitasse platea dictumst. Integer euismod imperdiet lacus, non pharetra eros pellentesque at. Proin pharetra, quam ac dignissim venenatis, est quam mattis neque, ut vestibulum ligula diam sed nisi. Mauris suscipit, ipsum quis facilisis sagittis, sapien metus lacinia neque, a lacinia ante nibh eget eros. Nulla gravida sagittis aliquam.

    Phasellus interdum mi et risus mollis lacinia. Donec et eros massa. Duis tincidunt, augue at vulputate consequat, est mauris posuere lacus, ut sollicitudin tortor massa ac mi. Ut eu urna porta leo blandit adipiscing. Integer convallis varius nulla, vitae vulputate lacus vulputate eu. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec aliquam viverra placerat. Etiam vestibulum nisi eu leo sagittis malesuada. Integer ut nisi ligula. Nulla cursus eros ac sem faucibus fringilla. Maecenas sed quam non tortor mollis suscipit in sed arcu. Suspendisse sit amet lacus at tortor ullamcorper varius. Suspendisse quis quam et metus varius sodales et ac felis. Nunc molestie mauris id diam congue id accumsan velit placerat. Maecenas euismod suscipit tortor, et elementum erat aliquam vitae. Quisque nec sem eget quam lobortis convallis sit amet vel magna.
    <br />
    <br />
    Ut nibh augue, interdum vel ornare at, porttitor vel felis. Donec adipiscing pellentesque tortor, vel fringilla nisi pellentesque et. Proin iaculis sem quis neque pulvinar facilisis. In vitae arcu vel arcu dignissim imperdiet non quis justo. Aliquam et purus vitae est eleifend porta eget in erat. Nam massa ligula, vehicula eu cursus eu, dictum sed arcu. Integer sit amet massa justo. Sed sit amet risus purus, at sollicitudin diam. Donec vel hendrerit neque. Nam semper purus in neque porttitor imperdiet. Nunc hendrerit ipsum et est euismod mollis. Sed risus magna, bibendum vel sodales a, fringilla quis dui. Vestibulum massa mi, condimentum id ultrices vitae, luctus eget libero. Nullam accumsan quam ac ante tempor ultrices. Integer lorem quam, eleifend a rhoncus nec, laoreet id nunc. Aenean blandit consequat adipiscing.

    Integer ultrices, mi ac fringilla lacinia, purus lorem lobortis diam, ac varius velit massa nec lectus. Nullam quis lectus vel risus auctor interdum. Quisque interdum tempor pulvinar. Quisque malesuada, turpis id mollis facilisis, libero orci adipiscing est, ut consectetur risus nisl quis purus. Suspendisse dignissim est eu nulla dapibus suscipit. Nam mollis facilisis bibendum. Proin non hendrerit elit. Aliquam dui nisi, lobortis ac adipiscing ut, aliquet vulputate ligula.
    <br />
    <br />
    In vel dolor dolor. Sed nunc nibh, dictum a tincidunt nec, sodales sit amet velit. Quisque ultrices sapien in metus suscipit egestas. Suspendisse tincidunt congue ante a accumsan. In ac nisi eu sem dictum malesuada. Nunc leo quam, vehicula et pulvinar a, iaculis id nibh. Maecenas non neque ac quam condimentum porttitor eget vel lorem. Morbi vitae est a tellus gravida tincidunt.

    Donec iaculis aliquet felis sed dictum. Morbi eget turpis turpis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam molestie porta ante eget dictum. Ut magna enim, ullamcorper eu feugiat laoreet, fringilla quis risus. Curabitur at leo sed lectus fringilla pharetra. Duis rutrum congue justo, sit amet hendrerit velit cursus sed. Proin at ipsum sapien.
    <br />
    <br />
    Aenean sodales fermentum est, ut rhoncus mauris ultrices quis. Vivamus sit amet dui arcu. Nulla sapien urna, ornare vitae ullamcorper quis, consectetur nec nisi. Fusce eu eros nec est tincidunt viverra. Donec placerat blandit urna porta sollicitudin. Vivamus viverra suscipit neque, et sodales ipsum gravida in. Phasellus id ligula magna, quis ultricies erat.

    </div>

    </body>

    </html>




    < Bu mesaj bu kişi tarafından değiştirildi sofistikot -- 14 Aralık 2012; 23:21:29 >







  • #resim { 
    position:fixed ;
    width:200px;
    height:200px;
    z-index:-1;
    }


    z-index ile yapabilirsin.
  • quote:

    Orijinalden alıntı: gokhanbey

    z-index ile yapabilirsin.


    doğru z-index, eyvallah.



    < Bu mesaj bu kişi tarafından değiştirildi sofistikot -- 14 Aralık 2012; 23:21:50 >
  • quote:

    Orijinalden alıntı: gokhanbey

    #resim { 
    position:fixed ;
    width:200px;
    height:200px;
    z-index:-1;
    }


    z-index ile yapabilirsin.

    Lorem ipsumu okudum niye yazdın
    -------------
    -1 kullanılmasını tavsiye etmem

    < Bu ileti mobil sürüm kullanılarak atıldı >
  • -9999; tercih ederim bende -1 yazmışım ama
  • quote:

    Orijinalden alıntı: gokhanbey

    -9999; tercih ederim bende -1 yazmışım ama

    Aslında ben - değerleri tercih etmem z-indexte o kadar + sayı varken. (İE için yaptığım uyumluluklardan alışkanlığımda var.)
  • lipsum yaratmam gerekiyor, insanlar anlamıyor sonra ne demek istediğimi , cevaplar için teşekkür ederim.



    < Bu mesaj bu kişi tarafından değiştirildi sofistikot -- 14 Aralık 2012; 23:22:35 >
  • Yapay Zeka’dan İlgili Konular
    Daha Fazla Göster
    
Sayfa: 1
- x
Bildirim
mesajınız kopyalandı (ctrl+v) yapıştırmak istediğiniz yere yapıştırabilirsiniz.