Gestione 2 immagini di backgroud in un div

lunedì 03 dicembre 2012 - 17.06
Tag Elenco Tags  VB.NET  |  .NET 4.0  |  Windows Server 2008 R2  |  Visual Studio 2010

trinity Profilo | Guru

salve ragazzi,

allora ho il div della pagina a cui ho inserito un'immagine di background che sarebbe una barra con il repeat-x....adesso all'interno di questo div ho inserito un oggetto Repeater che ovviamente aumenta la sua altezza a seconda dei record che carica. (ho gestito anche il massimo che può carica nella pagina). Adesso vorrei inserire un'immagine alla fine della pagina ma che tale immagine cambia la sua posizione in verticale a seconda dell'altezza che assume il repeater. Questa imamgine è la stessa che si riporta all'inizio della pagina...solo che se inserisco un nuov div, lui non riesce a gestire l'altezza del repeater...c'è un modo per far si che la posizione del div vari a seconda dell'altezza che assume il repeater?

Ciao
Cirillo Fabio
www.wondernet.biz
fabio@wondernet.biz
http://blogs.dotnethell.it/fabiocirillo/
http://wnetsoftware.blogspot.com

ridaria Profilo | Expert

>salve ragazzi,
>
>allora ho il div della pagina a cui ho inserito un'immagine di
>background che sarebbe una barra con il repeat-x....adesso all'interno
>di questo div ho inserito un oggetto Repeater che ovviamente
>aumenta la sua altezza a seconda dei record che carica. (ho gestito
>anche il massimo che può carica nella pagina). Adesso vorrei
>inserire un'immagine alla fine della pagina ma che tale immagine
>cambia la sua posizione in verticale a seconda dell'altezza che
>assume il repeater. Questa imamgine è la stessa che si riporta
>all'inizio della pagina...solo che se inserisco un nuov div,
>lui non riesce a gestire l'altezza del repeater...c'è un modo
>per far si che la posizione del div vari a seconda dell'altezza
>che assume il repeater?


.... non capito bene la struttura della pagina e l'esigenza che hai, se si potesse vedera la pagian sarebbe meglio ma diventa complicato.

CMQ forse ciò è quello che ti occorrerebbe:

Potresti provar3e a passare ad una funzione JS le dimensioni del repeater e della pagina, ed impostare via js le dimensioni e la posizione del div in questione. (float Height, margin etc......)

la funzione js la richiami con:

ClientScriptManager.RegisterStartupScript ...........


CIAO



Riccardo D'Aria

alx_81 Profilo | Guru

>.... non capito bene la struttura della pagina e l'esigenza che
>hai, se si potesse vedera la pagian sarebbe meglio ma diventa
>complicato.
sì, prova a passarci sia l'asp.net che l'html che potremmo provare a vedere se basta CSS.. Proviamo dai

--
Alessandro Alpi | SQL Server MVP
MCP|MCITP|MCTS|MCT

http://www.alessandroalpi.net
http://blogs.dotnethell.it/suxstellino
http://mvp.microsoft.com/profiles/Alessandro.Alpi

trinity Profilo | Guru

Allora ecco la pagina html in pratica nel primo div c'è questa immagine di background che è una barra in alto, un'altra barra che ha delle dimensioni diverse vorrei che venisse inserita alla fine della pagina...con la stessa proprietà delal prima ma se vedete utilizzo i comandi Telerik e c'è un Radajaxpanel con all'interno una radlistview. Questa è impostata a 10 record per pagina da caricare quindi a seconda del numero di record che carico l'altezza della radlistview può variare. Ecco vorrei che la seconda barra variasse la sua posizione in base all'altezza della radlistview..Voi direte mettila nella radajaxpanel..ma se facessi così significa che la barra non potra ripetere in orizzontale la sua posizione...provo a fare un esempio con immagine di come deve avvenire prendendo un'altra pagina a cui non c'è la radlistview e vi faccio vedere....



1887x486 43Kb


ecco se vedete queste due barre saranno due immagini anche perchp non penso che con una sola immagine si possa gestire il ridimensionamento in altezza dell'immagine stessa.

Ciao

Il codice sorgente non è stato renderizzato qui
perchè non c'è sufficiente spazio.
Clicca qui per visualizzarlo in una nuova finestra
Cirillo Fabio
www.wondernet.biz
fabio@wondernet.biz
http://blogs.dotnethell.it/fabiocirillo/
http://wnetsoftware.blogspot.com

ridaria Profilo | Expert

hai provato a reimpostare le dimensioni del div in questione via js al termine del load della pagina?


ciao
Riccardo D'Aria

alx_81 Profilo | Guru

>hai provato a reimpostare le dimensioni del div in questione
>via js al termine del load della pagina?
Indicativamente farlo in maniera dinamica con js potrebbe essere corretto, ma mi piacerebbe vedere proprio l'html creato, la sorgente presa dal browser, non l'asp:net.
Magari con un trick html senza logiche riusciamo a fare a meno del js.. Riesci a postare anche l'html?
Poi magari non si riesce, ma almeno abbiamo provato una soluzione che, a mio avviso, potrebbe essere meno manutenibile..
--
Alessandro Alpi | SQL Server MVP
MCP|MCITP|MCTS|MCT

http://www.alessandroalpi.net
http://blogs.dotnethell.it/suxstellino
http://mvp.microsoft.com/profiles/Alessandro.Alpi

trinity Profilo | Guru

Ecco il codice html:

comunque avevo pensato ad utilizzare Js ma non saprei come fare in questo mio caso :(

Il codice sorgente non è stato renderizzato qui
perchè non c'è sufficiente spazio.
Clicca qui per visualizzarlo in una nuova finestra
Cirillo Fabio
www.wondernet.biz
fabio@wondernet.biz
http://blogs.dotnethell.it/fabiocirillo/
http://wnetsoftware.blogspot.com

ridaria Profilo | Expert


>comunque avevo pensato ad utilizzare Js ma non saprei come fare
>in questo mio caso :(

in che senso come fare?

Se alla fine del caricamento della pagina hai le dimensioni del div contenitore, del repeater, per sottrazione puoi ricavare le dimensioni del div in questione e ridimensionarlo via js.

Punto primo, a termine del load della pagina puoi ricavare le dimensioni che necessitano al div da ridimensionare?

Se sì, siamo sulla buona strada.


Ciao



>
>Cirillo Fabio
>www.wondernet.biz
>fabio@wondernet.biz
>http://blogs.dotnethell.it/fabiocirillo/
>http://wnetsoftware.blogspot.com

Riccardo D'Aria

trinity Profilo | Guru

Allora ho fatto così: in vb net ho scritto quanto seguen nella page_load:


Me.ClientScript.RegisterStartupScript(Me.GetType, "", "Height_Div();", True)

mentre lato aspnet ho scritto così:

Il codice sorgente non è stato renderizzato qui
perchè non c'è sufficiente spazio.
Clicca qui per visualizzarlo in una nuova finestra

adesso ottengo l'altezza della Div. Tale valore dovrebbe diventare la posizione in verticale della div in basso, come faccio a passare questo valore?
Poi leggevo sulla rete che la proprietà position della div ha tra le sue la voce Relative che se non erro se tale div va messo subito dopo una tabella che varia la sua altezza, la div in questione come posizione prende il valore dell'oggetto precedente. Mi spiego se la tabella ha altezza 100px la div prenderà come posizione dal valore 100 in poi....Sbaglio o è giusto come dico? se fosse potrei testare anche questa strada

Ciao
Cirillo Fabio
www.wondernet.biz
fabio@wondernet.biz
http://blogs.dotnethell.it/fabiocirillo/
http://wnetsoftware.blogspot.com

trinity Profilo | Guru

ed in effetti funziona usando la strada della position=relative solo che il div non attiva la proprietà background-repeat: repeat-x

come faccio?


Cirillo Fabio
www.wondernet.biz
fabio@wondernet.biz
http://blogs.dotnethell.it/fabiocirillo/
http://wnetsoftware.blogspot.com

ridaria Profilo | Expert

>ed in effetti funziona usando la strada della position=relative
>solo che il div non attiva la proprietà background-repeat: repeat-x
>

la position relative indica che le distanze del div left e top (padding ...) sono relative al suo contenitore e non alla pagina.

Che abbia una position relative non infuisce affatto sul background image repat o non repeat.

Controlla bene, che deve trattarsi solo di percorsi a questo punto.



Riccardo D'Aria

trinity Profilo | Guru

allora ho scritto così:

<script type="text/javascript"> // prendo valore div contenitore radlistview function Height_Div() { var _heightdiv1 = document.getElementById("div_list").offsetHeight; var _positiondiv2 = document.getElementById("under"); _positiondiv2.style.top = (_heightdiv1) + "px"; } </script>

ed impostato il div "inder" come position=relative, solo che così mi sfalsa la posizioni..in quanto se faccio dei test l'altezza del div "div_list" che contine il reapeter è = 995 quindi la posizione del div "under" dovrebbe partire da 995px ma invece mi da un bello spazio in più...ho notato insernto un valore fisso al dv "under" che con 500px arriverei alla posizione che interessa me, stranissimo!!! solo che non ci può essere un valore fisso perchè l'altezza del div può variare.
Adesso devo impostare la position=absolute?

Ciao
Cirillo Fabio
www.wondernet.biz
fabio@wondernet.biz
http://blogs.dotnethell.it/fabiocirillo/
http://wnetsoftware.blogspot.com

ridaria Profilo | Expert

devo lavorarci su e fare dei test, la strada è questa, se la dimensione del div può cambiare di volta in volta solo via js puoi adeguare la sua dimensione aciò che ti occorre.


CIAO

fammi sapere
Riccardo D'Aria

trinity Profilo | Guru

Ok ma il div che si deve spostare, la sua position deve essere uguale ad absolute o relative?


Cirillo Fabio
www.wondernet.biz
fabio@wondernet.biz
http://blogs.dotnethell.it/fabiocirillo/
http://wnetsoftware.blogspot.com

ridaria Profilo | Expert

se sta in div e devi muoverlo in relazione al suo contenitore la position deve essere relative;

di concerto però anche il div contenitore deve avere una position di tipo specifico relative/absolute anche lui.

Io ci ho ccombatto di tanto in tanto e lo dimentico:

di seguito alcuni link che visito:

http://css-tricks.com/absolute-positioning-inside-relative-positioning/
http://www.barelyfitz.com/screencast/html-training/css/positioning/
http://segment7.net/projects/web/positioning.html


c'è da lottare con sti DIV :-)


CIAO
Riccardo D'Aria
Partecipa anche tu! Registrati!
Hai bisogno di aiuto ?
Perchè non ti registri subito?

Dopo esserti registrato potrai chiedere
aiuto sul nostro Forum oppure aiutare gli altri

Consulta le Stanze disponibili.

Registrati ora !
Copyright © dotNetHell.it 2002-2017
Running on Windows Server 2008 R2 Standard, SQL Server 2012 & ASP.NET 3.5