Nederlands Ondersteuningsforum :
Wilt u reageren op dit bericht? Maak met een paar klikken een account aan of log in om door te gaan.

Widget balk

Vorige onderwerp Volgende onderwerp Ga naar beneden

Opgeloste Topic Widget balk

Bericht van rohneke wo 2 dec 2015 - 22:36

Hoihoi,

Ik heb via het engelse forum een code gevonden dat als je je muis tegen de linker rand van het forum houd, er een balk 'uitschuift' met daarop widgets.

Nu is mijn vraag of het ook mogelijk is dat de widget balk van bovenaan het forum naar onderen 'uitklapt' en zo ja, welke code ik hiervoor moet gebruiken.

Heb een phpbb2 forum (http://dummies.forumactie.com/forum = testforum)


Voorbeeld 1:
Widget balk 15nont5


Voorbeeld 2:
Widget balk 2gu9mqf


Laatst aangepast door rohneke op di 8 dec 2015 - 7:12; in totaal 3 keer bewerkt

Terug naar boven Terug naar beneden

avatar

rohneke
Nieuw Forumlid

Vrouw
Aantal berichten : 42
Registratiedatum : 23-02-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

http://www.dutchexecutors.com/ http://dummies.forumactie.com/


rohneke is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van 10spetter10 za 5 dec 2015 - 0:09

Ik heb een andere manier geprobeerd waarbij ik javascript gebruik. Je moet juist een nieuwe widget maken met deze code in:

Code:
<div id="toggler" style="background:url(http://i63.tinypic.com/2zdx3dv.png); width: 180px; height: 81px;">
</div><script>
jQuery(function() {
jQuery('#left').after(jQuery('#toggler'));
jQuery('#left #toggler').remove();

jQuery('#toggler, #left').on('mouseover', function () {
jQuery('#left').addClass('hover');
});
jQuery('#toggler, #left').on('mouseout', function () {
jQuery('#left').removeClass('hover');
});
});
</script><style>
#left {
  height: auto;
  max-height: 0px;
  overflow: hidden;
  transition: 1s;
}
#left.hover {
  max-height: 2500px;
  overflow: hidden;
}
</style>

Zet 'use a table type : ' maar op 'nee' zodat je die randen niet meer ziet.

Op mijn testforum lijkt deze dan wel te werken maar het kan zijn dat ik nog wat ga moeten aanpassen zodat het ook goed werkt op jouw forum.

Code:
#left:hover {
  top: 0;
  overflow-y: auto !important;
}
#left {
  /* background: rgba(150, 150, 150, 0.200); */
  /* border-right: 1px solid #55DBD0; */
  position: fixed;
  padding: 6px;
  width: 180px !important;
  top: -710px;
  bottom: 0;
  overflow: hidden !important;
  transition: 300ms;
}

Hiervoor moet je wel je css die je nu had voor die widgetbalk wegdoen.

Terug naar boven Terug naar beneden

10spetter10

10spetter10
Medaille Forumlid
Medaille Forumlid

Man
Aantal berichten : 1222
Leeftijd : 23
Registratiedatum : 08-07-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja



10spetter10 is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van rohneke zo 6 dec 2015 - 21:03

Aha hij komt nu idd van boven naar beneden :-)

Maar het plaatje van het 'logo' staat nu ergens links van mijn menu balk:
En ook blijft ie staan als de balk naar beneden komt.

Voorbeeld:
Widget balk 10o4714

Pas als ik mijn muis daar op houd, komt de balk naar beneden.

Is de bedoeling dat die afbeelding bovenaan het forum staat :-)

Ook komt de balk over mijn header heen naar beneden terwijl hij mooier zou staat als hij meer aan de linker rand zou zitten:

Zo is hij:
Widget balk 2ug021s

Zo is mooier:
Widget balk 2q0lhm0

Hij blijft aan t begin ook een soort hangen Sad

Terug naar boven Terug naar beneden

avatar

rohneke
Nieuw Forumlid

Vrouw
Aantal berichten : 42
Registratiedatum : 23-02-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

http://www.dutchexecutors.com/ http://dummies.forumactie.com/


rohneke is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van 10spetter10 zo 6 dec 2015 - 23:12

Zou je even de sneeuw op je testforum willen uitzetten? Ik kan namelijk niets proberen doordat alles heel de tijd refresht met die sneeuw :/

Terug naar boven Terug naar beneden

10spetter10

10spetter10
Medaille Forumlid
Medaille Forumlid

Man
Aantal berichten : 1222
Leeftijd : 23
Registratiedatum : 08-07-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja



10spetter10 is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van rohneke ma 7 dec 2015 - 9:21

Staat nu uit jocolor

Terug naar boven Terug naar beneden

avatar

rohneke
Nieuw Forumlid

Vrouw
Aantal berichten : 42
Registratiedatum : 23-02-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

http://www.dutchexecutors.com/ http://dummies.forumactie.com/


rohneke is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van 10spetter10 ma 7 dec 2015 - 19:44

Probeer eens of het met deze code wel goed is. Smile

Code:
<div id="toggler" style="background:url(http://i63.tinypic.com/2zdx3dv.png); width: 180px; height: 81px;">
</div><script>
jQuery(function() {
jQuery('#left').after(jQuery('#toggler'));
jQuery('#left #toggler').remove();

jQuery('#toggler, #left').on('mouseover', function () {
jQuery('#left').addClass('hover');
});
jQuery('#toggler, #left').on('mouseout', function () {
jQuery('#left').removeClass('hover');
});
jQuery('#left').parent().addClass('widget_cont');
});
</script><style>
.widget_cont {
  position: absolute;
  left: 15px;
  top: 0px;
}
#left {
  height: auto;
  max-height: 0px;
  overflow: hidden;
  transition: 1s;
  background-image: url(http://i67.tinypic.com/2h5tr1u.png);
  background-color: #19111F;
  background-repeat: repeat-y;
}
#left.hover {
  max-height: 2500px;
  overflow: hidden;
}
</style>

Terug naar boven Terug naar beneden

10spetter10

10spetter10
Medaille Forumlid
Medaille Forumlid

Man
Aantal berichten : 1222
Leeftijd : 23
Registratiedatum : 08-07-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja



10spetter10 is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van rohneke ma 7 dec 2015 - 20:08

Hij staat op de goeie plek!! :-) Naisss

Zijn nog 2 dingetjes die niet helemaal kloppen denk ik.
Hij blijft nog steeds een soort van 'hangen' (zie linker afbeelding van voorbeeld hieronder)
Als ik mn muis daarna verder beweegt gaat de balk pas weer verder naar beneden.

Ook staat er nu een soort dubbele balk onder hetgene wat uitklapt (dit kan je op de linkse en rechtse afbeelding zien op het voorbeeld hieronder)

EDIT: Die 'dubbele balk' heb ik nu zelf weg gekregen.
Hij blijft wel nog een soort van hangen


Edit 2: Op het originele forum krijg ik een soort witte balk eronder als de balk uitschuift. Dit is alleen bij het lezen van een topic, niet op de home pagina etc.

Ik heb nu de CSS code wat aangepast hierdoor is geloof ik die witte balk weg Razz
Hij blijft wel nog steeds een soort van hangen.

Heb het idee dat het de communicatie is tussen de CSS en de speciale widget om die balk uit te laten schuiven.
Heb namelijk ook even die widget gedeactiveerd, en toen bleef die niet ha ngen (maar stond ie weer niet op goede plek)

Heb de CSS nu aangepast naar dit om die witte achtergrond weg te halen:

Code:
#left:hover {
  top: 0;
  overflow-y: auto !important;
}
#left {
  background-color:transparent;
  /* border-right: 1px solid #55DBD0; */
  position: fixed;
  top: -710px;
  padding: 0px;
  width: 180px !important;
  bottom: 0;
  overflow: hidden !important;
  transition: 300ms;
}

Terug naar boven Terug naar beneden

avatar

rohneke
Nieuw Forumlid

Vrouw
Aantal berichten : 42
Registratiedatum : 23-02-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

http://www.dutchexecutors.com/ http://dummies.forumactie.com/


rohneke is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van 10spetter10 ma 7 dec 2015 - 22:19

Voor die dubbele vex zou het beter zijn dat je de eerste weg doet, degene die je onderaan je leden-widget hebt geplaatst.
Dan zou je ook nog de fixed van je #left moeten weg doen, anders blijft de vex bovenaan staan.
Verder moet je ook terug de achtergrond kleur en afbeelding ( background: #19111f url(https://2img.net/h/oi67.tinypic.com/2h5tr1u.png); ) op #left instellen zodat je niet door de widget balk kijkt. Volgens mij zou die het dan moeten doen.

Die witte balk zou ik op het forum zelf moeten zien maar ik vermoed dat het een vulling gaat zijn. De witte kleur zou dan weg moeten zijn wanneer je de achtergrond op #left opnieuw instelt.

Terug naar boven Terug naar beneden

10spetter10

10spetter10
Medaille Forumlid
Medaille Forumlid

Man
Aantal berichten : 1222
Leeftijd : 23
Registratiedatum : 08-07-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja



10spetter10 is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van rohneke ma 7 dec 2015 - 22:42

Die witte balk heb ik zelf weg gekregen :-)
Heb die RGBA weg gehaald en daar background-color transparent gezet.

Hij werkt nu aardig... heel erg bedankt! cheers

Enige wat ik nu nog zie is een scroll balk als ie uitschuift terwijl de balk niet te lang is
Als de balk uitgeklapt is, is die ook weg je ziet hem alleen tijdens het omlaag klappen

Voorbeeld:
Widget balk 2lwubfd

Terug naar boven Terug naar beneden

avatar

rohneke
Nieuw Forumlid

Vrouw
Aantal berichten : 42
Registratiedatum : 23-02-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

http://www.dutchexecutors.com/ http://dummies.forumactie.com/


rohneke is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van 10spetter10 di 8 dec 2015 - 1:10

Oeps, die was ik heel de tijd vergeten weg te doen. Normaal zou het opgelost zijn als je in de css die ik je gaf volgende lijn weg doet:

Code:
#left:hover {
  top: 0;
  /*overflow-y: auto !important;  --  Deze lijn weg */
}

Terug naar boven Terug naar beneden

10spetter10

10spetter10
Medaille Forumlid
Medaille Forumlid

Man
Aantal berichten : 1222
Leeftijd : 23
Registratiedatum : 08-07-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja



10spetter10 is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van rohneke di 8 dec 2015 - 7:12

Hij is weg Smile Smile

Heel erg bedankt weer !!!

Terug naar boven Terug naar beneden

avatar

rohneke
Nieuw Forumlid

Vrouw
Aantal berichten : 42
Registratiedatum : 23-02-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

http://www.dutchexecutors.com/ http://dummies.forumactie.com/


rohneke is bedankt door de starter van dit topic.

Opgeloste Topic Re: Widget balk

Bericht van Liesbeth* di 8 dec 2015 - 7:54

.Widget balk Hurhad10.Ondersteunings Vraag opgelost en gesloten.


Widget balk 121910
   Veel Voorkomende Problemen | Forum Gereedschap | Tutorials | Skin Aanvraag | Forum Promotie Goedkeuring | Wachtwoord Hoofd-Beheerder kwijt? | Geen ondersteuning via PM | Ondersteuningsvraag opgelost? Markeer je topic dan met het icoon Widget balk 210610

Terug naar boven Terug naar beneden

Liesbeth*

Liesbeth*
Globaal Moderator
Globaal Moderator

Vrouw
Aantal berichten : 1264
Leeftijd : 66
Registratiedatum : 13-06-13
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Nee

https://pspparadise.actieforum.com/forum http://pspismagic.actieforum.com/


Liesbeth* is bedankt door de starter van dit topic.

Vorige onderwerp Volgende onderwerp Terug naar boven


Permissies van dit forum:
Je mag geen reacties plaatsen in dit subforum