2013-04-13 4 views
0

У меня есть этот набор кодов, который работает нормально, однако мне интересно, есть ли более чистый способ выполнения одного и того же вида, используя css и Javascript без использования iframes (но я взломал это чтобы получить внешний вид, который я хочу, по крайней мере, на последних версиях хром и ff).Сохранение такого же взгляда без использования iframes

В основном IFrame длинная строка таблицы с кучей картинок и у меня есть кнопка, которая при наведении мыши прокручивает IFrame над чтобы показать больше изображений здесь демо и важные фрагменты кода ниже

HTML страницы:

<html><body> 
<iframe id="recent" height="450px" width="100%" seamless; scrolling="no" src="http://ec2-23-22-226-163.compute-1.amazonaws.com/dframe.php"> 
<p>Your browser does not support iframes.</p> 
</iframe> 
<input type='button' class='btn_slide' onmouseover='make_scroll()' /> 
</body></html> 

с этим CSS (на кнопке)

input.btn_slide { 
display: block; 
position: absolute; 
z-index: 15; 
right: 0px; 
top: 80px; 
background-image: url(http://www.iconsdb.com/icons/preview/gray/arrow-33-xx$ 
background-color: transparent; /* make the button transparent */ 
background-repeat: no-repeat; /* make the background image appear only onc$ 
background-position: 0px 0px; /* equivalent to 'top left' */ 
border: none; 
height: 250px;   /* make this the size of your image */ 
width: 200px; 
} 

, а затем эту JavaScript:

function scroll() 
{ 
    window.scrollBy(250,0); // horizontal and vertical scroll increments 
    scrolldelay = setTimeout('scroll()', 1000); // scrolls every 100 millis$ 
} 
function make_scroll() 
{ 
    document.getElementById('recent').contentWindow.scroll(); 
} 

Теперь я обеспокоен тем, что я планирую иметь примерно 10 таких фреймов на странице, что означает обслуживать одну посещенную страницу. Я запрашиваю таблицы db и генерирую 11 отдельных html-страниц, которые кажутся действительно неэффективными (даже если большинство его можно кэшировать в производстве, но не идеально). Поэтому мне интересно, есть ли способ любопытного сохранить такой же внешний вид, не используя iframes, используя только css и javascript? Да или нет, или как я могу это сделать, будем очень благодарны!

ответ

3

http://codepen.io/anon/pen/qywuz

Пожалуйста, для любви, которая все святы, не используйте фреймы для этого, вы можете использовать дивы, поплавок влево и запас, чтобы сделать это легко.

Я рекомендую этот плагин для ползунков

http://caroufredsel.dev7studios.com/

Она делает все для вас.

И, пожалуйста, подтвердите свой код.

IFrames используются для особых задач, и это не один из них.

Кроме того, таблицы используются только в том случае, если у вас есть фактический стол или информационный бюллетень.

+1

спасибо stefen ... Я знал, что это не правильное использование iframes, следовательно, вопрос ... есть причина, по которой я использовал взломанный в вопросе, просто хотел показать внешний вид/функциональность, которую я хотел. Спасибо за ссылки, которые очень ценятся. – brendosthoughts

+0

Мое удовольствие, я думаю, что я слишком остро реагировал на ха-ха, я действительно хочу, чтобы ты на правильном пути! Удачи! Если вам нужна помощь, не стесняйтесь спрашивать меня. – Stephen

+0

спасибо, будет ... Я сейчас читаю о проверке ... Я пришел из java и c world, где мой компилятор делает проверку. Какие-нибудь хорошие инструменты для веб-технологий? (вместо моего текущего блокнота и консоли google devloper) – brendosthoughts

Смежные вопросы