mboost-dp1
CSS, Jquery UI og z-index
- Forside
- ⟨
- Forum
- ⟨
- Programmering
Jeg har et lille projekt, hvor der er behov for en opbygning af siden med 3 sektioner. To sektioner er drop-areas og 1 sektion er drag-objekter.
Den store sektion med drag-objekter indeholder 15-20 objekter, der hver kan tildeles nogle egenskaber afhængig af hvor de droppes. Men jeg har også brug for at drag-sektionen kan opdateres med nye drag-objekter MENS man dragger i et objekt. Altså...
Hvis jeg dragger 1 af de 20 objekter op i det drop-area, der indeholder en "menu", så skal hele drag-area'et skifte objekter ud til de, der er relevante i forhold til hvor man dropper dem i menuen.
Det har jeg sådan set også fået til at virke, men der opstår to problemer:
Hvis jeg lægger nye drag-objekter ind i samme div (og altså sletter de gamle), så slettes også det objekt, jeg er i færd med at trække i.
Hvis jeg laver en NY midlertidig div med de nye drag-objekter i, så gør lag-styringen i CSS at jeg ikke kan droppe dem på det nye lag.
Er der nogen, der har en simpel løsning på mit problem, der formentlig kræver mere forklaring fra mig...?
Den store sektion med drag-objekter indeholder 15-20 objekter, der hver kan tildeles nogle egenskaber afhængig af hvor de droppes. Men jeg har også brug for at drag-sektionen kan opdateres med nye drag-objekter MENS man dragger i et objekt. Altså...
Hvis jeg dragger 1 af de 20 objekter op i det drop-area, der indeholder en "menu", så skal hele drag-area'et skifte objekter ud til de, der er relevante i forhold til hvor man dropper dem i menuen.
Det har jeg sådan set også fået til at virke, men der opstår to problemer:
Hvis jeg lægger nye drag-objekter ind i samme div (og altså sletter de gamle), så slettes også det objekt, jeg er i færd med at trække i.
Hvis jeg laver en NY midlertidig div med de nye drag-objekter i, så gør lag-styringen i CSS at jeg ikke kan droppe dem på det nye lag.
Er der nogen, der har en simpel løsning på mit problem, der formentlig kræver mere forklaring fra mig...?
#2 Nej... Forestil dig at der er 2 divs
Div 1:
Drag_1 Drag_2 etc
Div 2:
Drop_1 Drop_2
Når du trækker i Drag_1 og den holdes OVER Drop_2, skal Div 1 opdateres over ajax med nyt indhold SÅ LÆNGE du ikke har sluppet Drag_1. Når Drag_1 slippes skal Div 1 igen indeholde det oprindelige indhold.
Caveat: Drag_1 skal også kunne droppes på Drag_2 og på de nye drag-objects, der dynamisk fyldes ind i Div 1.
Div 1:
Drag_1 Drag_2 etc
Div 2:
Drop_1 Drop_2
Når du trækker i Drag_1 og den holdes OVER Drop_2, skal Div 1 opdateres over ajax med nyt indhold SÅ LÆNGE du ikke har sluppet Drag_1. Når Drag_1 slippes skal Div 1 igen indeholde det oprindelige indhold.
Caveat: Drag_1 skal også kunne droppes på Drag_2 og på de nye drag-objects, der dynamisk fyldes ind i Div 1.
Det er helt fint at du ikke vil have det ud :)
Jeg har set kort på det, og det jeg forstår er at du gerne vil:
man dragger en item fra content boksen op på en menu item, for så at skifte over til at vise en div der "tilhøre" det menu punkt, hvorefer man kan smide den item man dragger der ind i, for på den måde at flytte den fra a-b uden at a og b er synlige på samme tid ?.
Jeg har set kort på det, og det jeg forstår er at du gerne vil:
man dragger en item fra content boksen op på en menu item, for så at skifte over til at vise en div der "tilhøre" det menu punkt, hvorefer man kan smide den item man dragger der ind i, for på den måde at flytte den fra a-b uden at a og b er synlige på samme tid ?.
http://jsfiddle.net/SPqGY/ noget i stil med det her måske ?
how to:
drag en rød boks op over en grøn:
vent i 0.3 sekunder så skifter view
til det view der passer til den boks du hover over.
nu kan du smide den røde ind der.
drop delen virker ikke så godt pga noget margin og padding osv, men oh well :)
smid oven på en anden rød, giver bedste resultat.
how to:
drag en rød boks op over en grøn:
vent i 0.3 sekunder så skifter view
til det view der passer til den boks du hover over.
nu kan du smide den røde ind der.
drop delen virker ikke så godt pga noget margin og padding osv, men oh well :)
smid oven på en anden rød, giver bedste resultat.
#7 bortset fra at
1. det skal ikke være sortable
2. en rød boks skal kunne droppes på en anden rød boks, der skaber et event, hvorefter den oprindelige div skal vises igen med de oprindelige classmembers i.
3. det er dynamisk, så den div, der vises ved hover, skal hente sit indhold fra en server og altså ikke være preloaded.
Jeg kigger lige på, om det kan justeres til mine behov. Tak for dit forsøg :)
1. det skal ikke være sortable
2. en rød boks skal kunne droppes på en anden rød boks, der skaber et event, hvorefter den oprindelige div skal vises igen med de oprindelige classmembers i.
3. det er dynamisk, så den div, der vises ved hover, skal hente sit indhold fra en server og altså ikke være preloaded.
Jeg kigger lige på, om det kan justeres til mine behov. Tak for dit forsøg :)
nr 1 er ikke noget problem, dog udfra det du har lavet på den side du linket mig, ville sortable give fin mening umiddelbart ? mere end draggable.
nr 2 dette forstår jeg simpelthen ikke
nr 3 dette er nemt nok, jeg kan godt lave et eksempel hvis du er i tvivl om hvordan dette skal gøres.
nr 2 dette forstår jeg simpelthen ikke
nr 3 dette er nemt nok, jeg kan godt lave et eksempel hvis du er i tvivl om hvordan dette skal gøres.
#1 Er fordi elementerne ikke skal kunne skifte side. . Hver classmember hører til sin egen klasse og Skal ikke kunne skifte hverken plads eller klasse. Men man skal kunne trække et classmember over på et andet classmember som så opdaterer noget på serven og bagefter flyttes classmember på plads igen.
ok, nu er jeg mere med på hvad du vil (tror jeg) så det er i stil med dette: http://jsfiddle.net/SPqGY/2/
(der hvor jeg har en alert, vil så være der hvor du ville lave noget server integration)
Hvis dette eksempel ikke er specifikt nok, eller ikke rammer helt det du søger, så tænker jeg at vi måske skulle prøve at kommunikere lidt mere flydende end forum posts(skype,msn,steam-chat,etc), så kan vi hurtigere nå til et resultat som ligner det du efterlyser :)
(der hvor jeg har en alert, vil så være der hvor du ville lave noget server integration)
Hvis dette eksempel ikke er specifikt nok, eller ikke rammer helt det du søger, så tænker jeg at vi måske skulle prøve at kommunikere lidt mere flydende end forum posts(skype,msn,steam-chat,etc), så kan vi hurtigere nå til et resultat som ligner det du efterlyser :)
Gå til top
Opret dig som bruger i dag
Det er gratis, og du binder dig ikke til noget.
Når du er oprettet som bruger, får du adgang til en lang række af sidens andre muligheder, såsom at udforme siden efter eget ønske og deltage i diskussionerne.