2012-11-06 16 views
20

Ho bisogno di spostare la finestra di commento popup associata a un pulsante simile a Facebook. Capisco che questa domanda è stata posta e risolta una miriade di volte.Sposta/Posizione Facebook Mi piace Pulsante Commento Popup

precedentemente chiesto: Facebook Like Widget on Fan page, Comment area out of visible area

Schermata della stessa questione come il mio: http://twitpic.com/4q7ggi

La differenza qui è che credo che Facebook ha cambiato l'attuazione negli ultimi mesi in modo che sia il pulsante Like e il commento i popup sono contenuti in un singolo iframe. Mi aspetterei che probabilmente lo facessero perché sarebbe l'unico modo affidabile per proteggersi contro i siti Web malevoli che approfittano degli utenti con contenuti di gradimento automatico. Tuttavia, ciò significa che non posso applicare CSS per riposizionare la casella dei commenti.

Sto utilizzando l'implementazione del pulsante HTML5, che è lo stesso utilizzato nel riferimento ufficiale di Facebook per i pulsanti simili http://developers.facebook.com/docs/reference/plugins/like/. Per vedere un esempio, fai di nuovo clic sul pulsante Mi piace sulla pagina di riferimento di Facebook e poi ispeziona l'elemento popup del commento. Vedrai che sia il pulsante Mi piace che il popup dei commenti sono contenuti nello stesso iframe.

+0

ho questo stesso problema –

+0

Ehi, io ho lo stesso problema di .. siete riusciti a risolvere questo? – ddb

risposta

1

questo funziona per me, ecco un esempio fiddle. Tutto ciò che faccio è stata una semplice modifica con i CSS:

.fb_edge_widget_with_comment span.fb_send_button_form_widget { 
    top:100px!important; /*for example*/ 
    left:100px!important;  /*for example*/ 
} 

speranza che questo aiuti.

+0

Non mi sembra che questo spostasse il riquadro dei commenti. – rjksn

+0

penso che sia come un vaso di miele :) - quello originale devo dire –

0

ho verificato l'esempio Facebook e sto vedendo questo commento scatola: http://screencast.com/t/fRQyUzqek

esaminai, e stylings applicato a questa classe:

.-cx-PRIVATE-pluginCommentFlyout__full { 
    top: 100px!important; 
    left: 100px!important; 
} 

E che spostato la casella di commento. Tuttavia, l'ho fatto direttamente nell'ispettore, quindi quando lo si utilizza nel CSS, potrebbe essere necessario includere anche i selettori padre per essere veramente specifici.

Spero che questo aiuti!

2

Non è possibile modificare il CSS del scatola commento all'interno del iframe perché è una violazione della same origin policy:

La politica consente gli script in esecuzione su pagine provenienti dallo stesso sito per accedere a ogni altro di metodi e proprietà senza restrizioni specifiche, ma impedisce l'accesso alla maggior parte dei metodi e delle proprietà tra pagine su siti diversi.

Il messaggio invio di scatola can be changed with CSS perché non risiede nel iframe.

4

Questo ha funzionato per me in passato.

.fb-like.fb_edge_widget_with_comment.fb_iframe_widget span iframe { 
    /* Now you can apply css here */ 
    bottom:0!important; 
} 
Problemi correlati