Web sayfasındaki belirli bir kaydırma konumuna köprü oluşturmak mümkün mü? Örneğin, http://www.stackoverflow.com/ adresine bir bağlantı oluşturmak istiyorum , ancak sayfa 100 piksel aşağı kaydırılmış olarak.
Yanıtlar:
JQuery scrollTo eklentisini kullanarak belirli bir konuma gidebilirsiniz . Demo sayfasına bir göz atarsanız, eklentinin belirli bir konuma kaydırma da dahil olmak üzere birçok farklı seçeneğe sahip olduğunu göreceksiniz. Bu, hedefin JavaScript'ini kontrol etmeniz gerekeceği anlamına gelir, bu nedenle bu, harici bir siteye bağlantı için uygun olmayabilir.
Sayfadaki herhangi bir yere vanilya yolu bağlantısı, sayfada zaten bulunan bir bağlantı noktası üzerinden yapılır .
Bu <a>…</a>etiket kullanılarak oluşturulabilir . "Bağlantı noktası" nda (yukarıda) belirtilen bağlantının #h-12.2sonunda olduğunu unutmayın. Bu <a id="h-12.2">12.2</a>, sayfayı oluşturan HTML'ye gömülüdür ve tıklandığında sayfa görünümünü bu bağlantıya yeniden konumlandırır.
HTML5'ten önce nameözelliğin bağlantı etiketinde kullanıldığını, ancak artık desteklenmediğini ve idözelliğin yerinde ( başvuru ) kullanılması gerektiğini unutmayın . Bu aynı zamanda bir sabitleme etiketi için herhangi bir öğeyi kullanabileceğiniz anlamına gelir, öğeyle sınırlı değildir <a>.
Paul'un cevabına benzer şekilde, bir HTML belgesindeki etiket kimliğinin ilk oluşumuna da bağlanabilirsiniz. Bu tam olarak piksel sayısı olmayacak.
Örneğin, bu sayfanın sorusuna veya cevaplarına bağlantı verin / kaydırın .
Sayfadaki Öğeleri sağ tıklamayı ve Denetlemeyi deneyin. <a>Etiketleri bulacaksınız, bunlar bağlantı noktalarıdır.
Sonra <ilk ve son önce çıkar, aböylece bağlantı olarak görünmez. Aslında size aşağıdaki önizlemeyi gösterdiğinde yanıt kutusuna yazarken efektleri görebilirsiniz.
a href="/superuser/382047/linking-to-a-specific-scroll-position-on-a-web-page#question-header">question /a>
ve
a href="/superuser/382047/linking-to-a-specific-scroll-position-on-a-web-page#answers">answers /a>
Gördüğünüz gibi, tek fark, çapanın pound ( #) simgesinden sonra isimlendirildiği en sondadır . bağlantıdan sonraki ad >, bağlantının kullanıcıya nasıl okunacağıdır.
Bu durumda "soru başlığı" "soru" olarak okunur ve cevaplar aynı olur.
Daha sonra aşağıdakiler Mike'ın yorumuna bağlanmalıdır . Bağlantı noktaları olduğu için382094
Açıklığa kavuşturmak için, bağlantı noktasını bulabilir ve bağlantınızdan #sonra ekleyebilirsiniz .
/superuser/382047/linking-to-a-specific-scroll-position-on-a-web-page#question-header
/superuser/382047/linking-to-a-specific-scroll-position-on-a-web-page#answers
/superuser/382047/linking-to-a-specific-scroll-position-on-a-web-page#880079
bunların hepsi sizi aynı sayfada farklı yerlere götürecektir.
Sayfadaki piksele özgü bir konuma bağlanmak için bağlantı etiketini "üst: x sol: y" koordinatlarını kullanarak kesinlikle konumlandırılmış bir divın içine yerleştirin.
Sen kullanabilirsiniz Citebite o pozisyonda kimliği kullanmıyor bile bir web sayfasının belirli bir pozisyona bağlantı. Kullanımı kolaydır. Burada sağladığım bağlantıya gidin ve ardından web sayfanıza Alıntı metin alanına gittikten sonra göstermek istediğiniz metnin yığınını yapıştırın ve ardından web sayfasının bağlantısını Kaynak URL metin alanına sağlayın. Sonra Citebite yapmak için tıklayın. Sonra bir bağlantı oluşturur. Bu bağlantı istediğiniz bağlantı olacaktır.