Page 1 sur 1

Problème dans Turn.js

Posté : 30 avr. 2019, 19:15
par Horace
Bonjour,
Je suis nouveau sur ce site. et nouveau en JS, mais un peu moins nouveau dans la vie (75 ans !)
J'utilise un code js tous fait, trouvé dans Turn.js/samples/magazine, le tout téléchargeable sur www.trunjs.com.
Ca marche très bien, mais vous savez ce que c'est, on en veut toujours plus !
L'exemple magazine affiche des pages qui sont des fichiers image .jpg
Je voudrai afficher pareil mais des pages html
Ici, le code dans magazine.js :

Code : Tout sélectionner


 * Magazine sample

function addPage(page, book) {

	var id, pages = book.turn('pages');

	// Create a new element for this page
	var element = $('<div />', {});

	// Add the page to the flipbook
	if (book.turn('addPage', element, page)) {

		// Add the initial HTML
		// It will contain a loader indicator and a gradient
		element.html('<div class="gradient"></div><div class="loader"></div>');

		// Load the page
		loadPage(page, element);
	}

}

function loadPage(page, pageElement) {

	// Create an image element

	var img = $('<img />');

	img.mousedown(function(e) {
		e.preventDefault();
	});

	img.load(function() {
		
		// Set the size
		$(this).css({width: '100%', height: '100%'});

		// Add the image to the page after loaded

		$(this).appendTo(pageElement);

		// Remove the loader indicator
		
		pageElement.find('.loader').remove();
	});

	// Load the page

	img.attr('src', 'pages/' +  page + '.jpg');

	loadRegions(page, pageElement);

}
Voir aussi dans magazine/index.html.
Quelqu'un aurait-il la patience de crocher dans ce code et de me donner une idée ?
Merci d'avanc
H.

Re: Problème dans Turn.js

Posté : 10 mai 2019, 10:54
par webmaster
Bonjour,

Une page HTML peut être affichée dans un objet iframe
Le script peut être adaptée pour remplacer la création de l'image par une iframe, alimentée avec l'adresse de la page.

Re: Problème dans Turn.js

Posté : 15 mai 2019, 17:54
par Horace
Merci, c'est exactement ce que je voudrais faire, mais ...
Mais je ne sais pas comment modifier l'instruction du script

Code : Tout sélectionner

	
	var img = $('<img />');
	img.mousedown(function(e) {
		e.preventDefault();
	});
Pour en faire une variable iframe !
Un bon conseil ?
Une ou deux lignes de code ?
Merci d'avance
H.

Re: Problème dans Turn.js

Posté : 16 mai 2019, 11:30
par Horace
Bon, autant pour moi !
Mon cerveau était un peu paresseux (beaucoup ?)
Mais j'ai trouvé l'essentiel et je vous fais part de mes futures découverts et résultats !
Merci
H.

Re: Problème dans Turn.js

Posté : 22 mai 2019, 21:37
par Horace
Et voilà !
Mon cerveau s'est remis en marche, et un petit <iframe> bien placé a fait l'affaire.
Donc et post est clos pour moi.
Merci
H.