Ciao a tutti.
Il tema di Wordpress che sto utilizzando permette l'inserimento di video da youtube; tuttavia ho bisogno di modificarne il comportamento al restringersi e all'allargarsi della finestra. Cosa che il tema non fa in automatico. Mi dà problemi soprattutto l'attributo height.
Ho ragionato in questo modo, lavorando esclusivamente con jQuery:
1. Ho impostato la width dell'iframe a 100%, in modo che si adatti alla finestra, ponendomi l'obiettivo di andare a modificare anche l'height in modo dinamico.
2. Tramite la funzione $("iframe").width() riesco a rilevare la larghezza reale del video;
3. Impostando una variabile, dico di prendere il valore della width e dividerlo per 1.7 per ottenere il valore dell'height;
4. Impostando un'altra variabile, assegno l'height così calcolata al frame, in modo da metterla sempre proporzionata.
Il problema è che il sistema funziona bene soltanto ad ogni refresh, mentre io vorrei che lo facesse anche al resize della finestra. Qualcuno ha qualche idea?
Il sito è questo;
Lo script che ho usato è questo:
codice:
<script> |
|
|
|
$(document).ready(function(){ |
|
|
|
|
|
$(".fusion-video iframe, iframe").removeAttr("width"); |
|
$(".fusion-video iframe, iframe").removeAttr("height"); |
|
$(".fusion-video iframe, iframe").attr |
|
({"style" : "width:100% !important"}); |
|
$(".fusion-video, .fusion-youtube").attr |
|
({"style" : "max-width:100% !important"}); |
|
|
|
var larghezzavideo = $("iframe").width(); |
|
var altezzavideo = $("iframe").height(); |
|
var altezzavideomod = larghezzavideo / 1.782; |
|
var altezzavideoarr = Math.round(altezzavideomod); |
|
|
|
$("#prova-tasto").click(function() |
|
{ |
|
alert(larghezzavideo); |
|
alert(altezzavideoarr); |
|
}); |
|
|
|
$(".fusion-video iframe, iframe").attr |
|
({"height" : altezzavideoarr}); |
|
|
|
|
|
}); |
|
</script> |
Cliccando sul tasto escono alert con valori di width e height