Nie znam się zbyt dobrze, a wręcz wcale w Javascript, więc proszę proszę o pomoc!
Z góry dziękuję
Na sugester.pl jest całkiem przyjemny skrypt, który dokleja z boku strony przycisk "Twoja sugestia" i po kliknięciu na niego wyskakuje ramka a'la Lightbox, z tym, że w środku zawiera HTMLową treść. Moje pytanie jest takie - jak stworzyć, aby w takiej ramce była wczytana moja własna strona? Albo chociaż coś na wzór tego?
Nie znam się zbyt dobrze, a wręcz wcale w Javascript, więc proszę proszę o pomoc!
Z góry dziękuję
Nie znam się zbyt dobrze, a wręcz wcale w Javascript, więc proszę proszę o pomoc!
Z góry dziękuję
Coś takiego:
Diva sobie ostylujesz jak będziesz chciał.
Kod
var ObiektXMLHttp = false;
if (window.XMLHttpRequest) {
ObiektXMLHttp = new XMLHttpRequest();
} else if (window.ActiveXObject) {
ObiektXMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
function pobierzDane(zrodlo, cel) {
if (ObiektXMLHttp) {
ObiektXMLHttp.open("GET", zrodlo);
ObiektXMLHttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded; charset=UTF-8');
ObiektXMLHttp.onreadystatechange = function() {
if (ObiektXMLHttp.readyState == 4) {
document.getElementById(cel).innerHTML = ObiektXMLHttp.responseText;
}
}
ObiektXMLHttp.send();
document.getElementById('ramka').style.display="block";
}
}
if (window.XMLHttpRequest) {
ObiektXMLHttp = new XMLHttpRequest();
} else if (window.ActiveXObject) {
ObiektXMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
function pobierzDane(zrodlo, cel) {
if (ObiektXMLHttp) {
ObiektXMLHttp.open("GET", zrodlo);
ObiektXMLHttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded; charset=UTF-8');
ObiektXMLHttp.onreadystatechange = function() {
if (ObiektXMLHttp.readyState == 4) {
document.getElementById(cel).innerHTML = ObiektXMLHttp.responseText;
}
}
ObiektXMLHttp.send();
document.getElementById('ramka').style.display="block";
}
}
Diva sobie ostylujesz jak będziesz chciał.
Ewentualnie zastosuj skrypt jquery nyroModal - do pobrania tutaj
Dzięki wszystkim, spróbuję i powiem czy się udało =)
Chciałem najpierw boczny panel ale w phpbb3.0.9 nie chciał się wyświetlać, może to pomoże. Dzięki jeszcze raz.
Chciałem najpierw boczny panel ale w phpbb3.0.9 nie chciał się wyświetlać, może to pomoże. Dzięki jeszcze raz.
Cytat(fastlone @ 23.08.2011, 11:45:13 ) 
Ewentualnie zastosuj skrypt jquery nyroModal - do pobrania tutaj
Hej
Przepraszam za odkop ale zainteresował mnie wpis dotyczący nyroModala sciagnolem paczkę według opisu na jego stronie niestety nie udało mi się ich uruchomić żeby działały poprawnie.
Z jego strony chciałem uruchomić pierwszy przykład aby moc przeanalizować jak to to działa.
Będę wdzięczny za każdą pomoc docelowo chciałem zrobić coś w stylu galerii w której po kliknięciu obrazka pojawiało się okno z tekstem linkami itd wraz z powiększonym obrazkiem
zrobiłem na razie tyle poniżej kod który wykorzystałem z jego strony:
index
Tego pliku nie było w paczce wiec to może być problem(inna wersja)
niestety dopiero się uczę i trudno jest mi znalesc gdzie jest problem
wyskakujace okno nie pojawia się.
to jest orginalny plik ktory znalazlem na necie niestety nie bylo go w paczce:
Przepraszam za odkop ale zainteresował mnie wpis dotyczący nyroModala sciagnolem paczkę według opisu na jego stronie niestety nie udało mi się ich uruchomić żeby działały poprawnie.
Z jego strony chciałem uruchomić pierwszy przykład aby moc przeanalizować jak to to działa.
Będę wdzięczny za każdą pomoc docelowo chciałem zrobić coś w stylu galerii w której po kliknięciu obrazka pojawiało się okno z tekstem linkami itd wraz z powiększonym obrazkiem
zrobiłem na razie tyle poniżej kod który wykorzystałem z jego strony:
index
CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="js/jquery-1.9.0.js" type="text/javascript"></script>
<script src="js/jquery.nyroModal.custom.js" type="text/javascript"></script>
<link href="styles/nyroModal.css" rel="stylesheet" type="text/css" />
<link href="styles/global.css" rel="stylesheet" type="text/css" />
</head>
<body>
<a href="demoSent.php" class="nyroModal">Ajax</a>
<a href="demoSent.php#test" class="nyroModal">Ajax Filtering Content #test</a>
<a href="demoSent.php#blabla" class="nyroModal">Ajax Filtering Content #blabla</a>
<script type="text/javascript">
$(function() {
$('.nyroModal').nyroModal();
});
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="js/jquery-1.9.0.js" type="text/javascript"></script>
<script src="js/jquery.nyroModal.custom.js" type="text/javascript"></script>
<link href="styles/nyroModal.css" rel="stylesheet" type="text/css" />
<link href="styles/global.css" rel="stylesheet" type="text/css" />
</head>
<body>
<a href="demoSent.php" class="nyroModal">Ajax</a>
<a href="demoSent.php#test" class="nyroModal">Ajax Filtering Content #test</a>
<a href="demoSent.php#blabla" class="nyroModal">Ajax Filtering Content #blabla</a>
<script type="text/javascript">
$(function() {
$('.nyroModal').nyroModal();
});
</script>
</body>
</html>
Tego pliku nie było w paczce wiec to może być problem(inna wersja)
niestety dopiero się uczę i trudno jest mi znalesc gdzie jest problem
wyskakujace okno nie pojawia się.
to jest orginalny plik ktory znalazlem na necie niestety nie bylo go w paczce:
CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>nyroModal :: Demo</title>
<link rel="stylesheet" href="styles/nyroModal.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.nyroModal-1.6.2.pack.js"></script>
</head>
<body>
<?php
$debug = '
GET Var: '.print_r($_GET, 1).'<hr />
POST Var: '.print_r($_POST, 1).'<hr />
FILES Files: '.print_r($_FILES, 1).'<hr />';
?>
<?php echo $debug ?>
You can whatever you want in the ajax request.<br />
You can create easyly :<br />
<a href="demo.php" class="nyroModalClose">close link</a><br />
<button class="nyroModalClose">close button</button><br />
<a href="demoSent.php" class="nyroModal">new modal</a><br />
<form class="nyroModal" method="post" action="demoSent.php">
<input type="text" name="fromAjax" />
<input type="submit" value="new modal from a form" />
</form><br />
<a href="#" class="resizeLink">Resize Modal</a>
<br />
<br />
<div id="test">
<?php if ($_GET['nyroModalSel'] == 'test' || $_POST['nyroModalSel'] == 'test'): ?>
<?php echo $debug ?>
<script type="text/javascript">
$(function() {
$.nyroModalSettings({height: 200, width: 200});
});
</script>
<?php endif; ?>
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
</div>
<hr />
<div id="blabla">
<?php if ($_GET['nyroModalSel'] == 'blabla' || $_POST['nyroModalSel'] == 'blabla'): ?>
<?php echo $debug ?>
<script type="text/javascript">
$(function() {
$.nyroModalSettings({height: 250, width: 700});
});
</script>
<?php endif; ?>
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
</div>
<script type="text/javascript">
$(function() {
$.nyroModalSettings({height: 500, width: 500});
});
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>nyroModal :: Demo</title>
<link rel="stylesheet" href="styles/nyroModal.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.nyroModal-1.6.2.pack.js"></script>
</head>
<body>
<?php
$debug = '
GET Var: '.print_r($_GET, 1).'<hr />
POST Var: '.print_r($_POST, 1).'<hr />
FILES Files: '.print_r($_FILES, 1).'<hr />';
?>
<?php echo $debug ?>
You can whatever you want in the ajax request.<br />
You can create easyly :<br />
<a href="demo.php" class="nyroModalClose">close link</a><br />
<button class="nyroModalClose">close button</button><br />
<a href="demoSent.php" class="nyroModal">new modal</a><br />
<form class="nyroModal" method="post" action="demoSent.php">
<input type="text" name="fromAjax" />
<input type="submit" value="new modal from a form" />
</form><br />
<a href="#" class="resizeLink">Resize Modal</a>
<br />
<br />
<div id="test">
<?php if ($_GET['nyroModalSel'] == 'test' || $_POST['nyroModalSel'] == 'test'): ?>
<?php echo $debug ?>
<script type="text/javascript">
$(function() {
$.nyroModalSettings({height: 200, width: 200});
});
</script>
<?php endif; ?>
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
Only this content will be shown if the hash is passed.<br />
</div>
<hr />
<div id="blabla">
<?php if ($_GET['nyroModalSel'] == 'blabla' || $_POST['nyroModalSel'] == 'blabla'): ?>
<?php echo $debug ?>
<script type="text/javascript">
$(function() {
$.nyroModalSettings({height: 250, width: 700});
});
</script>
<?php endif; ?>
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
</div>
<script type="text/javascript">
$(function() {
$.nyroModalSettings({height: 500, width: 500});
});
</script>
</body>
</html>
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.