HTML - 跳轉到一個iframe

我有一個像這樣HTML - 跳轉到一個iframe

<li><a href="classes/journeydistance.html" target="classes">Class Name </a></li>

一系列的鏈接，進入此iframe

<IFRAME src="classes/yaddayadda.html" style="width:400px;height:700px;" frameborder="0" name="classes" scrolling="auto"> 
</IFRAME>

然而，iframe是在頁面的底部，鏈接頂部有一堆文字。有人有這樣的方式，當人點擊課程鏈接，它跳轉到iframe？

來源

2011-09-19 Expecto

：D是的！給我一秒我想嘗試一下 – sg3s

這裏是一個有效的解決方案：（使用觸摸的javascript）

http://jsfiddle.net/RGjCL/4/

<ul> 
    <li> 
     <a href="javascript:void(0)" 
      onclick="IFrameScroll('http://www.asdf.com')">Class Name</a> 
    </li> 
</ul> 

<script type="text/javascript"> 
    function IFrameScroll(link){ 
     window.classes.location=link; 
     window.location.hash='classes' 
    } 
</script>

來源

2011-09-19 18:12:09

嗯，這也不適合我，iframe甚至不顯示。 – Expecto

不顯示？您是否點擊了鏈接：'http：// jsfiddle.net/RGjCL/4 /'我的答案中的代碼僅僅是一個示例，說明javascript將如何工作 –

作品，謝謝！ – Expecto

您可以通過給的iframe的ID這樣做的把主題標籤中的鏈接：

<iframe id="myIframe" rc="classes/yaddayadda.html" style="width:400px;height:700px;" frameborder="0" name="classes" scrolling="auto"></iframe> 
And the link: <li><a href="classes/journeydistance.html#myIframe" target="classes">Class Name </a></li>

我沒有測試過，但我認爲它會奏效。

來源

2011-09-19 18:02:19 Joeran

可悲的是，不工作 – Expecto

好了我最初的想法很快就粉碎（想用一招，做一個純HTML/CSS件事第二個想法很愚蠢）。

由於您已經使用錨點（標記）觸發了某個操作，因此除非使用JavaScript，否則無法對其執行更多操作。

因此，這裏是概念的使用jQuery http://jsfiddle.net/sg3s/Wpnng/2/

這樣，如果JS關閉它只是不會向下滾動鏈接仍然可以使用一個工作證明...

我不認爲有隻是在HTML/CSS的一種方式，我不會使用jQuery，如果這是您將加載它的唯一的東西...

做了一個小的改進，目標w/e是在鏈接的目標屬性有人被點擊，但是，如果你總是想滾動到相同的iframe，這會讓它變得更慢：http://jsfiddle.net/sg3s/Wpnng/3/

來源

2011-09-19 18:39:13 sg3s

好的，我編輯了CSS文件以匹配......按照示例放入鏈接，並將JavaScript文件附加到網站上......並且它仍然無效。我已檢查，以確保JavaScript已打開，並嘗試它在Firefox和ie ... – Expecto

@JosepthVodary你將需要jquery加載太或它確實不會工作。如果你不想自己託管js庫，你可以使用這個代碼和google api鏈接'' – sg3s

HTML - 跳轉到一個iframe

回答

相關問題