hujung hadapan web
tutorial js
Bagaimana untuk melaksanakan menu lipatan dan pengembangan mudah dalam js
Bagaimana untuk melaksanakan menu lipatan dan pengembangan mudah dalam js
Artikel ini terutamanya memperkenalkan kaedah melaksanakan menu lipatan dan membuka lipatan dalam js, dan melibatkan teknik berkaitan operasi dinamik javascript transformasi elemen halaman Ia mempunyai nilai rujukan tertentu seperti berikut:
Apa yang kami perkenalkan di sini ialah bar navigasi menu yang boleh dilipat dan dibesarkan itu sendiri.
Tangkapan skrin kesan berjalan adalah seperti berikut:
Alamat demo dalam talian adalah seperti berikut:
http: //demo.jb51.net/ js/2015/js-simple-hidden-show-menu-codes/
Kod khusus adalah seperti berikut:
<html>
<script>
function show(c_Str)
{if(document.all(c_Str).style.display=='none')
{document.all(c_Str).style.display='block';}
else{document.all(c_Str).style.display='none';}}
function high(){
if (event.srcElement.className=="k"){
event.srcElement.style.background="336699"
event.srcElement.style.color="white"
}
}
function low(){
if (event.srcElement.className=="k"){
event.srcElement.style.background="99CCFF"
event.srcElement.style.color=""
}
}
</script>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>导航栏</title>
<style>
td { cursor: hand; font-family: Tahoma; background-color: #336699; color: #99CCFF; font-size: 10pt }
li{ color: #FF0000; font-family: Tahoma; background-color: #99CCFF; font-size: 9pt}
.up{ background-color: #3A6EA5; border-left: 1 solid #A6C1DF;border-right: 1 solid #002200; border-top: 1 solid #A6C1DF; border-bottom: 1 solid #002200 }
</style>
</head>
<body topmargin="0" leftmargin="5">
<p align="left">
<table border="0" width="48" cellspacing="0" cellpadding="0">
<tr>
<td><p class=up onclick=show("a0")>+01-10</p><p onmouseover=high() onmouseout=low() id=a0 style="display:none">
<li class=k>01</li>
<li class=k>02</li>
<li class=k>03</li>
<li class=k>04</li>
<li class=k>04</li>
<li class=k>05</li>
<li class=k>06</li>
<li class=k>07</li>
<li class=k>08</li>
<li class=k>09</li>
<li class=k>10</li>
</p></td>
</tr>
<tr>
<td><p class=up onclick=show("a1")>+11-20</p><p onmouseover=high() onmouseout=low() id=a1 style="display:none">
<li class=k>11</li>
<li class=k>12</li>
<li class=k>13</li>
<li class=k>14</li>
<li class=k>15</li>
<li class=k>16</li>
<li class=k>17</li>
<li class=k>18</li>
<li class=k>19</li>
<li class=k>20</li>
</p></td>
</tr>
<tr>
<td><p class=up onclick=show("a2")>+21-30</p><p onmouseover=high() onmouseout=low() id=a2 style="display:none">
<li class=k>21</li>
<li class=k>22</li>
<li class=k>23</li>
<li class=k>24</li>
<li class=k>25</li>
<li class=k>26</li>
<li class=k>27</li>
<li class=k>28</li>
<li class=k>29</li>
<li class=k>30</li>
</p></td>
</tr>
<tr>
<td><p class=up onclick=show("a3")>+31-40</p><p onmouseover=high() onmouseout=low() id=a3 style="display:none">
<li class=k>31</li>
<li class=k>32</li>
<li class=k>33</li>
<li class=k>34</li>
<li class=k>35</li>
<li class=k>36</li>
<li class=k>37</li>
<li class=k>38</li>
<li class=k>39</li>
<li class=k>40</li>
</p></td>
</tr>
<tr>
<td><p class=up onclick=show("a4")>+41-50</p><p onmouseover=high() onmouseout=low() id=a4 style="display:none">
<li class=k>41</li>
<li class=k>42</li>
<li class=k>43</li>
<li class=k>44</li>
<li class=k>45</li>
<li class=k>46</li>
<li class=k>47</li>
<li class=k>48</li>
<li class=k>49</li>
<li class=k>50</li>
</p></td>
</tr>
<tr>
<td><p class=up onclick=show("a5")>+51-60</p><p onmouseover=high() onmouseout=low() id=a5 style="display:none">
<li class=k>51</li>
<li class=k>52</li>
<li class=k>53</li>
<li class=k>54</li>
<li class=k>55</li>
<li class=k>56</li>
<li class=k>57</li>
<li class=k>58</li>
<li class=k>59</li>
<li class=k>60</li>
</p></td>
</tr>
<tr>
<td><p class=up onclick=show("a7")>+61-70</p><p onmouseover=high() onmouseout=low() id=a7 style="display:none">
<li class=k>61</li>
<li class=k>62</li>
<li class=k>63</li>
<li class=k>64</li>
<li class=k>65</li>
<li class=k>66</li>
<li class=k>67</li>
<li class=k>68</li>
<li class=k>69</li>
<li class=k>70</li>
</p></td>
</tr>
<tr>
<td><p class=up onclick=show("a8")>+71-80</p><p onmouseover=high() onmouseout=low() id=a8 style="display:none">
<li class=k>71</li>
<li class=k>72</li>
<li class=k>73</li>
<li class=k>74</li>
<li class=k>75</li>
<li class=k>76</li>
<li class=k>77</li>
<li class=k>78</li>
<li class=k>79</li>
<li class=k>80</li>
</p></td>
</tr>
</table>
</p>
</body>
</html>Kod di atas ialah keseluruhan kandungan bab ini Untuk lebih banyak tutorial berkaitan, sila Lawati Tutorial Video JavaScript!
Alat AI Hot
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Undress AI Tool
Gambar buka pakaian secara percuma
Clothoff.io
Penyingkiran pakaian AI
AI Hentai Generator
Menjana ai hentai secara percuma.
Artikel Panas
Alat panas
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa
Dreamweaver CS6
Alat pembangunan web visual
SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)
Topik panas
Alat penting untuk analisis saham: Ketahui langkah-langkah untuk melukis carta lilin dengan PHP dan JS
Dec 17, 2023 pm 06:55 PM
Alat penting untuk analisis saham: Pelajari langkah-langkah untuk melukis carta lilin dalam PHP dan JS, contoh kod khusus diperlukan Dengan perkembangan pesat Internet dan teknologi, perdagangan saham telah menjadi salah satu cara penting bagi banyak pelabur. Analisis saham adalah bahagian penting dalam membuat keputusan pelabur, dan carta lilin digunakan secara meluas dalam analisis teknikal. Mempelajari cara melukis carta lilin menggunakan PHP dan JS akan memberikan pelabur maklumat yang lebih intuitif untuk membantu mereka membuat keputusan yang lebih baik. Carta candlestick ialah carta teknikal yang memaparkan harga saham dalam bentuk candlestick. Ia menunjukkan harga saham
Disyorkan: Projek pengesanan dan pengecaman muka sumber terbuka JS yang sangat baik
Apr 03, 2024 am 11:55 AM
Teknologi pengesanan dan pengecaman muka adalah teknologi yang agak matang dan digunakan secara meluas. Pada masa ini, bahasa aplikasi Internet yang paling banyak digunakan ialah JS Melaksanakan pengesanan muka dan pengecaman pada bahagian hadapan Web mempunyai kelebihan dan kekurangan berbanding dengan pengecaman muka bahagian belakang. Kelebihan termasuk mengurangkan interaksi rangkaian dan pengecaman masa nyata, yang sangat memendekkan masa menunggu pengguna dan meningkatkan pengalaman pengguna termasuk: terhad oleh saiz model, ketepatannya juga terhad. Bagaimana untuk menggunakan js untuk melaksanakan pengesanan muka di web? Untuk melaksanakan pengecaman muka di Web, anda perlu biasa dengan bahasa dan teknologi pengaturcaraan yang berkaitan, seperti JavaScript, HTML, CSS, WebRTC, dll. Pada masa yang sama, anda juga perlu menguasai visi komputer yang berkaitan dan teknologi kecerdasan buatan. Perlu diingat bahawa kerana reka bentuk bahagian Web
Sarung telefon Google Pixel 9 Pro Fold terdedah: Skrin luar 6.4 inci, skrin dalam 8.02 inci
Jun 25, 2024 pm 02:35 PM
Menurut berita pada 25 Jun, sumber ytechb menerbitkan catatan blog semalam (24 Jun), berkongsi paparan sarung telefon bimbit Google Pixel 9 Pro Fold, sekali lagi menunjukkan reka bentuk bahagian belakang skrin lipat ini. Menurut berita sebelum ini, Google akan mengeluarkan siri telefon bimbit Pixel 9 pada Oktober tahun ini Selain tiga telefon dalam siri Pixel 9, Pixel Fold juga akan disertakan dalam siri Pixel 9, dan akan dinamakan Pixel 9. Pro Fold selepas ia dilancarkan secara rasmi. Sarung telefon yang terdedah kali ini datang daripada pengeluar aksesori Torro, kedai dalam talian UK dan AS telah menyenaraikan sarung telefon produk dan mendedahkan reka bentuk serta saiz paparan telefon. Halaman menunjukkan sejumlah besar pemaparan sarung telefon Pixel 9 Pro Fold
Telefon lipat Samsung 10,000 yuan W25 didedahkan: kamera hadapan bawah skrin 5 megapiksel dan badan lebih nipis
Aug 23, 2024 pm 12:43 PM
Menurut berita pada 23 Ogos, Samsung akan melancarkan telefon bimbit lipat W25 baharu, yang dijangka akan diumumkan pada penghujung September Ia akan membuat penambahbaikan yang sepadan dalam kamera hadapan bawah skrin dan ketebalan badan. Menurut laporan, Samsung W25, dengan nama kod Q6A, akan dilengkapi dengan kamera bawah skrin 5 megapiksel, yang merupakan penambahbaikan berbanding kamera 4 megapiksel siri Galaxy Z Fold. Selain itu, kamera hadapan skrin luaran W25 dan kamera sudut ultra lebar masing-masing dijangka 10 juta dan 12 juta piksel. Dari segi reka bentuk, W25 adalah kira-kira 10 mm tebal dalam keadaan terlipat, iaitu kira-kira 2 mm lebih nipis daripada Galaxy Z Fold 6 standard. Dari segi skrin, W25 mempunyai skrin luaran 6.5 inci dan skrin dalaman 8 inci, manakala Galaxy Z Fold6 mempunyai skrin luaran 6.3 inci dan skrin dalaman 8 inci.
Kelemahan terbesar telefon mudah alih skrin boleh lipat: tiada senario aplikasi teras
Mar 16, 2024 am 09:04 AM
Apa yang kita bincangkan hari ini bukanlah seperti mana produk tertentu, tetapi kembali kepada topik "skrin lipat" itu sendiri dan meneroka "rasional" telefon bimbit skrin lipat. Pertama, mari kita lihat prestasi pasaran telefon bimbit skrin lipat Menurut laporan data terkini IDC, pasaran telefon bimbit skrin lipat China akan menghantar kira-kira 7.007 juta unit pada tahun 2023, peningkatan tahun ke tahun sebanyak 114.5%. Antaranya, pasaran telefon mudah alih skrin lipat China menghantar kira-kira 2.771 juta unit pada suku keempat 2023, peningkatan tahun ke tahun sebanyak 149.6%. Data itu kelihatan baik, dan pertumbuhannya juga sangat kukuh. Walau bagaimanapun, berbanding dengan kira-kira 270 juta penghantaran telefon pintar di pasaran China pada 2023, data ini sebenarnya tidak mencukupi. Secara umum
Cara membuat carta candlestick saham menggunakan PHP dan JS
Dec 17, 2023 am 08:08 AM
Cara menggunakan PHP dan JS untuk mencipta carta lilin saham Carta lilin saham ialah grafik analisis teknikal biasa dalam pasaran saham Ia membantu pelabur memahami saham dengan lebih intuitif dengan melukis data seperti harga pembukaan, harga penutup, harga tertinggi. dan harga terendah turun naik harga saham. Artikel ini akan mengajar anda cara membuat carta lilin saham menggunakan PHP dan JS, dengan contoh kod khusus. 1. Persediaan Sebelum memulakan, kita perlu menyediakan persekitaran berikut: 1. Pelayan yang menjalankan PHP 2. Pelayar yang menyokong HTML5 dan Kanvas 3
Model Samsung Galaxy Z Flip 6 pertama kali didedahkan: bezel lebih sempit, lipatan masih ada
Jun 22, 2024 am 03:28 AM
Menurut berita pada 21 Jun, media asing baru-baru ini mengeluarkan gambar model Samsung Galaxy Z Flip 6 di Internet. Mengikut gambar, boleh difahamkan bahawa sempadan Samsung Galaxy Z Flip 6 akan dikecilkan lagi, yang bermaksud bahawa lebar telefon mungkin dikurangkan dalam keadaan terlipat, dan ia juga akan memberikan cengkaman dan mudah alih yang lebih selesa . Lebih-lebih lagi, berbanding dengan ZFlip5 generasi sebelumnya, model Galaxy ZFlip6 lebih segi empat sama dan modul kamera di bahagian belakang lebih menonjol. Ia dijangka menggunakan sensor kamera baharu. Walaubagaimanapun dari hadapan, lipatan telefon masih agak ketara, namun memandangkan model yang bocor adalah telefon model, mungkin ada sedikit perbezaan dengan telefon sebenar, jadi ia adalah untuk rujukan sahaja. Dari segi konfigurasi prestasi, Galaxy
IDC menganggarkan bahawa penghantaran telefon pintar global pada 2024 ialah 1.2 bilion unit: 25 juta unit skrin boleh lipat, peningkatan tahun ke tahun sebanyak 37%
Feb 24, 2024 pm 02:20 PM
Menurut berita pada 24 Februari, IDC baru-baru ini mengeluarkan laporan penyelidikan pasaran, meramalkan bahawa penghantaran telefon pintar global akan mencapai 1.2 bilion unit pada 2024, peningkatan tahun ke tahun sebanyak 2.8%, dan kemudian akan mengekalkan pertumbuhan satu digit yang rendah menjelang 2028 . IDC percaya bahawa penghantaran keseluruhan pada tahun 2024 masih akan berada di bawah paras pra-pandemik, tetapi pasaran telefon pintar global telah menurun dan mula menunjukkan arah aliran menaik dalam pemulihan. IDC percaya bahawa dua faktor utama yang mendorong pemulihan pasaran keseluruhan ialah kitaran penyegaran peralatan dan pertumbuhan permintaan dalam pasaran baru muncul. Terdapat juga dua kuasa penggerak utama IDC menganggarkan bahawa penghantaran telefon mudah alih skrin lipat akan mencapai 25 juta unit pada tahun 2024, peningkatan tahun ke tahun sebanyak 37% adalah bahawa kecerdasan buatan (AI) telah menjadi sebahagian daripadanya perbincangan mengenai telefon pintar, mencetuskan
