1. 程式人生 > >H5 分幀(frameset) 使用分幀寫一個頁面,可以實現點選聯動效果

H5 分幀(frameset) 使用分幀寫一個頁面,可以實現點選聯動效果

需要兩個檔案:

檔案3.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>

        <a href="https://weibo.com/" target="a"><font color="black">微&nbsp&nbsp博</font></a><br/>

        <a href="http://tejia.aili.com/temai/" target="a" name="特價"><font color="black">今日特價</font></a><br/>

        <a href="http://kan.2345.com/" target="a" name="電視劇"><font color="black">電視劇</font></a><br/>

        <a href="https://ju.taobao.com/?ali_trackid=2:mm_33793785_3431230_70732360:1539605098_115_583908894" target="a"><font color="black">聚划算</font></a><br/>
        <a href="https://www.tmall.com/?ali_trackid=2:mm_26632324_6844396_70732504:1539605119_141_42020766" target="a"><font color="black">天貓</font></a>
        <a href="https://jx.tmall.com/?ali_trackid=2:mm_26632324_6844396_25190451:1539605147_123_87761644" target="a">·<font size="1" color="black">服飾尚新</font></a><br/>

        <a href="http://www.cctv.com/" target="a"><font color="black">央視網</font></a><br/>
        <a href="http://www.ctrip.com/" target="a"><font color="black">攜程旅行網</font></a><br/>
        <a href="https://www.suning.com/?utm_source=2345&utm_medium=mingzhan" target="a"><font color="black">蘇寧易購</font></a><br/>
                
        
    </body>
</html>

檔案二:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <frameset cols="300, *" >
        <frame src="檔案3.html"/>

        <frameset rows="100%,*">        
            
            <frame name="a"/>
            <frame name="a"/>
            <frame name="a"/>
            <frame name="a"/>
            <frame name="a"/>
            <frame name="a"/>
            <frame name="a"/>
            <frame name="a"/>
            <frame name="a"/>

        </frameset>
    
    </frameset>
</html>

效果:點選左邊導航的網頁,右邊分幀頁面出現具體網址,點選下一個直接覆蓋上一個頁面