Pop timbul yang sempurna

Takeaways Key

Tingkap pop timbul boleh digunakan dengan berkesan dan tidak invasif, dengan syarat ia dilaksanakan dengan betul. Kesalahan umum termasuk isu-isu dengan skrip, enjin carian, kebolehcapaian, alat pengurusan tapak, pembunuh pop timbul, dan pilihan untuk menghentikan pop timbul dari pembukaan.
Untuk membuat pop timbul yang sempurna, pertimbangkan untuk menggunakan fungsi yang boleh diletakkan dalam beberapa kod JavaScript yang dikongsi bersama. Fungsi ini dengan mudah boleh dipanggil dari mana saja di laman web ini, dan ia lebih disukai daripada menulis fungsi Window.Open setiap kali. Fungsi ini harus mengendalikan aspek fokus, menilai keadaan pop timbul, menutup tetingkap pop timbul, dan membuka semula dengan dimensi baru.
Adalah penting untuk menyediakan pautan atau butang dalam tetingkap pop timbul sendiri untuk membolehkan pengguna menutupnya. Walau bagaimanapun, jika pengguna mempunyai skrip yang dilumpuhkan, pautan 'Tutup tetingkap ini' hendaklah ditulis ke laman web menggunakan JavaScript, dan periksa sama ada tetingkap dibuka sebagai sebahagian daripada kaedah Window.Open (). Jika ia adalah pop timbul yang benar, pautan akan muncul dan kaedah dekat () akan berfungsi; Jika ia bukan tetingkap pop timbul yang benar, pautan tidak akan muncul.

Jika anda percaya seperti Jakob Neilsen dan penyokongnya, tidak ada yang lebih jahat daripada tingkap pop timbul. Dan dalam banyak cara, ini betul. Kenapa? Nah, kami akan menyenaraikan sebab -sebab yang tidak lama lagi, tetapi secara ringkasnya ia adalah kerana mereka hampir selalu dilaksanakan dengan baik atau tidak diperlukan. Tutorial ini akan menunjukkan bahawa, dengan pemikiran yang betul, tingkap pop timbul boleh digunakan tanpa mengganggu sesiapa-terutamanya orang yang melayari laman web anda.

Masalah dengan pop timbul

Kesalahan biasa dengan tingkap pop timbul adalah:

jika skrip dilumpuhkan, atau jika penyemak imbas tidak menyokong JavaScript, pop timbul tidak akan berfungsi

enjin carian tidak dapat mengikuti pautan ke tingkap pop timbul (Elemen skrip selalu diabaikan)
Pop timbul masalah kebolehcapaian yang ada
alat pengurusan tapak (mis. Dreamweaver) tidak dapat mengemas kini pautan ke pop timbul jika anda memindahkan halaman destinasi ke bahagian lain di laman web anda
Ramai orang mempunyai pembunuh pop timbul yang menutup tetingkap ketika ia dibuka
Di Mozilla, ada pilihan untuk menghentikan pembukaan pop timbul di tempat pertama
• Phew. Itu cukup senarai ... dan anda mungkin boleh menambah sendiri ke senarai ini. Jadi, bagaimana kita menangani perkara ini?

skrip dilumpuhkan

Dengan skrip yang dilumpuhkan, pop timbul tidak melakukan apa-apa. Mudah seperti itu. Tetapi jika anda menggunakan standard , tidak akan ada masalah sedemikian. Jadi, bukannya menggunakan:

anda mungkin menggunakan:

<a href="#" onclick="window.open('file.htm');"> 

Dengan cara ini, jika skrip dilumpuhkan, pautan standard masih berfungsi.

bagaimanapun, mungkin ada alasan yang sangat baik mengapa anda mahu tetingkap dibuka di atas tetingkap semasa. Jika ya, tambahkan atribut sasaran seperti:

<a href="file.htm" onclick="window.open('file.htm');return false;">

<a href="#" onclick="window.open('file.htm');"> 

bingo. Masalah diselesaikan. Tetapi ada lebih banyak yang boleh kita lakukan untuk ini!

enjin carian

Dengan kod yang dipinda di atas, enjin carian mendapatkan HREF standard untuk diikuti, jadi itu satu lagi isu yang ditandakan dari senarai masalah kami.

Masalah kebolehcapaian

Kesalahan terbesar dengan pop-up adalah bahawa mereka mengambil tumpuan dari tetingkap penyemak imbas utama, dan ini boleh membingungkan. Mereka juga membentangkan isu kebolehgunaan umum selain aksesibiliti. Berapa kerapkah anda melihat seseorang melancarkan pop timbul dan kemudian secara tidak sengaja klik kembali pada tetingkap pelancar dan, memikirkan bahawa tiada apa yang berlaku, klik pautan sekali lagi tanpa hasil? Sudah tentu tingkap telah dibuka tetapi kini di bawah tetingkap pelancar, dan hanya bergerak ke bar tugas dan memilih tetingkap dari sana akan menyelesaikannya.

Caranya adalah untuk memaklumkan pengguna bahawa pautan akan dibuka dalam tetingkap baru. Terdapat beberapa cara untuk menangani perkara ini:

• sertakan arahan sebagai sebahagian daripada pautan itu sendiri
tambahkan beberapa arahan dalam atribut tajuk
Gunakan ikon yang sesuai untuk menandakan pop timbul akan berlaku

Dengan cara ini, jika fokus hilang, pengguna boleh membuat sambungan, sebagai contoh:
Buka halaman ujian saya (dibuka dalam tetingkap pop timbul)

Buka halaman ujian saya

Untuk menangani isu kehilangan fokus pada tetingkap utama, anda boleh menggunakan JavaScript untuk menetapkan semula fokus. Skrip yang dicadangkan untuk ini muncul pada akhir artikel ini.

alat pengurusan pautan laman web

Sekiranya anda berada dalam kebiasaan bergerak halaman di sekitar menggunakan alat seperti Dreamweaver atau sistem pengurusan kandungan, anda berharap bahawa pautan dikekalkan. Dengan HREF standard, mereka biasanya (bergantung kepada alat yang anda gunakan), tetapi dengan JavaScript tidak mungkin. Kembali ke kod kami sebentar:

<a href="file.htm" onclick="window.open('file.htm');return false;">

Pautan di atas akan dikekalkan dengan baik ... hampir. Separuh daripadanya akan - bahagian HREF. Tetapi bahagian onclick mungkin akan diabaikan. Ini adalah masalah besar. Anda mungkin berfikir bahawa pautan anda telah dikemas kini, tetapi sebenarnya orang yang mempunyai JavaScript didayakan akan dihantar ke halaman yang hilang. Jadi, anda mungkin mendapati kod anda akan ditukar kepada:

<a href="file.htm" onclick="window.open('file.htm'); <br>
return false;" target="newWin">

Dan jika anda menjalankan validator pautan pada halaman pelancaran, nampaknya pautan anda memang sah. Jadi, bagaimana kita menangani isu ini? Suka begitu:

<a href="file.htm" onclick="window.open('file.htm');  <br>
return false;">

Hanya ada satu pautan untuk mengekalkan, dan HREF yang betul akan digunakan untuk kaedah Window.Open. Cemerlang â € "Sekarang kita mendapat tempat!

pembunuh pop-up/mozilla melumpuhkan pop timbul

Seperti isu JavaScript yang dilumpuhkan, hanya menyediakan HREF standard bermakna pautan itu masih akan berfungsi. Sekarang kita hanya perlu menangani isu tetingkap mana yang mempunyai tumpuan ...

skrip pop timbul yang sempurna

Kami mengesyorkan menggunakan fungsi yang boleh diletakkan dalam beberapa kod JavaScript yang dikongsi bersama (seperti yang telah kami lakukan dengan laman web ini), dan yang mudah dipanggil dari mana-mana sahaja di laman web ini. Ini jauh lebih disukai daripada menulis fungsi tingkap. Sebagai tambahan kepada URL, anda mungkin ingin memasukkan parameter seperti ketinggian dan lebar, dan jenis gaya pop timbul untuk dipilih (terpulang kepada anda apa gaya yang anda tentukan).

inilah kod yang saya cadangkan:

<a href="#" onclick="window.open('file.htm');"> 

Kod tambahan dalam fungsi mengendalikan aspek fokus. Jika anda mengklik pautan yang memanggil fungsi ini, kemudian klik kembali pada halaman supaya pop timbul tersembunyi, dan kemudian klik pada pautan pop timbul yang lain, kod menilai keadaan pop timbul, kemudian menutup tetingkap pop timbul dan membuka semula dengan dimensi baru.

untuk memanggil fungsi anda akan menggunakan kod berikut:

<a href="file.htm" onclick="window.open('file.htm');return false;">

atau, untuk menggunakan beberapa contoh sebenar:

ini Adakah pautan pop timbul saya (mod konsol)
Ini Adakah pop timbul saya (mod tetap)
Ini Adakah saya (mod elastik)

Nota: Bahagian 'kembali palsu' secara berkesan membatalkan tindakan lalai HREF, jadi ia tidak akan membuka pop timbul dan tingkap HTML biasa-ia akan membuka satu atau yang lain. Cuba pautan di atas dengan dan tanpa JavaScript membolehkan untuk melihat sendiri.

Apa lagi yang boleh anda minta? Baiklah ... ada satu bahagian akhir icing pada kek ini.

Menutup pop timbul

Apabila pop timbul dibuka, kami mungkin bergantung kepada orang untuk menggunakan kawalan sistem penyemak imbas/operasi untuk menutup tetingkap yang baru dibuka.

Tetapi orang tidak selalu melakukan ini! Oleh itu, kita harus menyediakan pautan (atau butang, jika anda lebih suka) dalam tetingkap pop timbul sendiri untuk membolehkan pengguna menutupnya. Walau bagaimanapun, mari kita anggap bahawa pengguna kami mempunyai skrip yang dilumpuhkan, dan tetingkap pop timbul dibuka melalui laluan HREF standard. Pautan 'Tutup tetingkap ini' yang anda sediakan dengan bijak akan mendorong dialog yang tidak sangat mesra seperti ini:

Untuk mendapatkan masalah ini, anda harus menulis pautan dekat ke laman web menggunakan JavaScript, dan periksa untuk melihat sama ada tetingkap dibuka sebagai sebahagian daripada kaedah Window.Open (). Dengan cara itu, jika ia adalah pop timbul yang benar, pautan akan muncul dan kaedah dekat () akan berfungsi; Jika ia bukan tetingkap pop timbul yang benar, pautan tidak akan muncul.

inilah kod untuk melakukan ini:

<a href="file.htm" onclick="window.open('file.htm'); <br>
return false;" target="newWin">

Cuba pautan sekali lagi, dan lihat sendiri:

ini Adakah pop timbul saya (mod tetap)

Kesimpulan

Mudah-mudahan tutorial ini menunjukkan bahawa pautan pop timbul boleh diakses, enjin carian mesra dan tidak invasif. Walau bagaimanapun, walaupun anda mengikuti semua nasihat ini, anda masih perlu bertanya kepada diri sendiri jika anda benar -benar perlu membuka tetingkap baru.

Satu titik akhir yang perlu diperhatikan ialah pop timbul harus menjadi sesuatu yang orang pilih untuk digunakan, jadi jangan gunakan acara window.onload atau window.onunload untuk memaksa tetingkap pop timbul anda pada pengguna. Itu selalu mengganggu orang ... kecuali mereka mahu membeli kamera X10 atau melawat 'kasino dalam talian terbesar di dunia' tetapi tidak tahu, itu!

Atas ialah kandungan terperinci Pop timbul yang sempurna. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!