Jak ukryć główną treść strony i zastąpić ją z ramką sms

Cześć.

Tworząc LP dla klientów, a nawet ostatnio tylko pomagając w tej kwestii, spotykam się z problemem jak rozsądnie i efektownie umieścić ramkę SMS, jeśli jest ona w formie iframe, a nie widgetu.

Postanowiłem udostępnić Wam krótki kod, który zastąpi główną treść strony, np. z całym generatorem, przyciskiem, pokazując po wciśnięciu przycisku samą ramkę na sms. 

Ogólnie zasada jest taka, że musimy posiadać 2 pojemniki (div'y).

Pierwszy (.krok_1) - główny, z całą treścią, np. generatorem, a drugi (.krok_2) początkowo ukryty zawierający ramkę.

Jeśli klikając przycisk np. "Generuj"  (#btn) potrzebujemy wyświetlić ramkę, robimy to poprzez płynne ukrycie pierwszego pojemnika, a wyświetlenie drugiego.

Kod wygląda tak:

<script type="text/javascript">
	$(document).ready(function(){
				$("#btn").click(function() {
                $(".krok_1").slideUp(500);
                $(".krok_2").slideDown(1000);
               process();	
				});
			});
		</script>

Całość : http://www.w3schools.com/code/tryit.asp?filename=FCHO8ACE6HT1

Pamiętajcie. Pierwszy pojemnik musi mieć nadaną klasę krok_1, drugi z ramką musi posiadać klasę krok_2, oraz wyświetlanie ustawione przez CSS jako ukryte(display:none).  Przycisk ma być oznaczony id="btn".

Jeśli coś Wam nie działa, sprawdźcie, czy macie zaimportowaną bibliotekę jquery w sekcji head jak to w powyższym linku.

Myślę, że @Aleks1723 może potwierdzić, że fajnie się to sprawdza (mimo, że sam nie wie, że tego używa  )

Nie wiem czy komuś się przyda, ale że ludzie o to pytają i często używam tego skryptu przy kodowaniu, mam nadzieję, że jednak ktoś go dobrze spożytkuje

Potwierdzam  Działa jak sub sms'owa społeczność chciała xd