jQuery scrollto

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Oracle Apex developer

Bedrijfsomschrijving My client is a technology company based in Den Bosch, the Netherlands. They specialize in providing innovative software solutions to clients, and they are currently looking for an experienced Oracle Apex developer to join the IT team. Functieomschrijving As an Oracle Apex developer, you will be responsible for designing, developing, and maintaining web-based applications using Oracle Apex. You will work closely with project managers, business analysts, and other developers to ensure that clients' needs are met and that the software solutions are of the highest quality. Responsibilities: Design, develop, and maintain Oracle Apex applications. Work with project managers and

Bekijk vacature »

Senior Front end developer

Functie Wij zijn op zoek naar een ambitieuze, zelfsturende Front-end Expert die ons (internationale) team komt versterken. Onze huidige software development afdeling bestaat uit 7 developers en designers. Wij zijn een écht softwarehuis, dus ervaring in software development is wel echt een must. Er wordt tegelijkertijd aan meerdere projecten gewerkt, voor mooie toonaangevende klanten. Je hebt dus regelmatig te maken met deadlines en opleveringen. Een deel van onze omgeving is in Angular.JS. Dit deel wordt langzamerhand omgebouwd naar de nieuwste versie van Angular. Jouw werkzaamheden zullen bestaan uit: Het aansturen en begeleiden van jouw collega’s Het implementeren van visuele elementen

Bekijk vacature »

Software ontwikkelaar ASP .Net / C#

Functie omschrijving Gezocht! Software ontwikkelaar. Ben jij bekend met termen als ASP .Net, C# en SQL? Ben jij op zoek naar een afwisselende en uitdagende IT-functie binnen de agrarische sector? En omschrijf jij jezelf als zelfstandig, enthousiast en proactief? Dan hebben wij de perfecte functie voor jou! Als Software ontwikkelaar binnen deze organisatie ben je samen met één andere collega verantwoordelijk voor de ontwikkeling en modificatie van het support en controle programma dat binnen dit bedrijf gebruikt wordt. Je gaat hierbij bijdragen aan de vertaling van klantwensen naar effectieve softwareoplossingen. Verder bestaan je werkzaamheden uit: Technische uitwerking van de business

Bekijk vacature »

Back end developer Onderwijssoftware

Functie Als back end developer kom jij terecht in een klein, maar hecht team bestaande uit 5 andere developers (waarvan 2 senioren, 2 medior en 1 junior). Met de gezamenlijke missie om “ieder kind te helpen met onze software” wordt er dagelijks gepassioneerd en hard gewerkt aan ons in-house ontwikkeld platform. Deze software is gebaseerd is op AI, machine Learning en wetenschappelijke inzichten. Dagelijks zul jij werken met onze high traffic webapplicatie. We hebben ruim 300.00 gebruikers en meer dan 2 miljard records waar je te maken mee krijgt! Verder zul jij je bezighouden met: – Het ontwikkelen van hoogwaardige

Bekijk vacature »

Fullstack Developer

Functieomschrijving Heb je kort geleden jouw HBO diploma ICT development behaald? Of zit je nog aan het begin van je carrière en heb je affiniteit met C#.NET? Voor een erkende werkgever in de omgeving van Oosterhout zijn wij op zoek naar een fullstack developer. Als C#.NET developer werk je samen met een vooruitstrevend team aan het ontwikkelen van maatwerk software voor klanten. Je hebt affiniteit met SQL, maar nog belangrijker is dat je kennis en ervaring hebt met C#.NET. Jouw werkzaamheden zien er als volgt uit: Het ontwikkelen van onze high-availability en high-performance backend; Je begint de dag rond 8:30

Bekijk vacature »

Junior .NET Developer

Dit ga je doen Als junior .NET Developer lever je met jouw oplossingen direct een bijdrage aan de bedrijfsprocessen van de klanten. Werkzaamheden waar jij je zoal mee bezig houdt zijn; Het ontwikkelen, onderhouden en optimaliseren van de draaiende platforms van de klanten; Softwareontwikkeling middels C#, .NET; Klantcontact om de wensen te bespreken en uit te werken; Optimaliseren van de (huidige) bedrijfsprocessen; De IT-afdeling bestaat uit 30 personen verdeeld over 3 teams. Het team waar je in terecht komt bestaat uit ongeveer tien man. Het is een team wat bestaat uit betrokken collega’s, waar iedereen bereidt is om elkaar te

Bekijk vacature »

Senior .NET Ontwikkelaar

In het kort Als Senior .NET ontwikkelaar ga je binnen onze business unit Transport en Logistiek aan de slag met complexe maatwerk software voor bedrijf kritische systemen binnen de technische automatisering. Denk bijvoorbeeld een IoT-oplossing voor de logistieke sector waarbij we van ruim 200.000 machines de telemetrie en events verwerken. We zijn actief in de distributielogistiek, havenlogistiek (denk aan ECT) en productielogistiek. Naast C# en .NET Core maken we ook gebruik van Azure technologie. En als trotse Microsoft Gold Partner leren we graag van en met jou. Wil jij jezelf blijven ontwikkelen binnen de technische automatisering met .NET, dan gaan

Bekijk vacature »

Software Developer

Functie omschrijving Heb jij affiniteit met ICT en een WO diploma in de pocket? Dan ben je hier aan het juiste adres. Voor een opdrachtgever in Amsterdam zijn wij op zoek naar kandidaten die (enige) ervaring hebben met Java, Javascript, C of C++. Je zal door middel van trainingen worden opgeleid tot een volwaardige Software Developer. Er wordt tijdens de training natuurlijk veel aandacht besteedt aan de vaktechnische aspecten, maar er gaat ook veel aandacht uit naar jouw persoonlijke ontwikkeling. Bedrijfsprofiel Bij deze opdrachtgever in de omgeving van Amsterdam zoeken ze meerdere enthousiaste kandidaten die hun carrière willen starten met

Bekijk vacature »

Oracle APEX developer

Wat je gaat doen: Als Oracle APEX ontwikkelaar bij DPA werk je samen met collega’s aan de meest interessante opdrachten. Je zult je ervaring met SQL, PL/SQL, JavaScript, HTML en CSS inzetten om wensen van opdrachtgevers te vertalen naar technische oplossingen. Je werk is heel afwisselend, omdat DPA zich niet beperkt tot een specifieke branche. Zo ben je de ene keer bezig binnen de zorgsector, de andere keer is dit bij de overheid. Wat we vragen: Klinkt goed? Voor deze functie breng je het volgende mee: Je hebt een hbo- of universitaire opleiding afgerond Je hebt 2 tot 5 jaar

Bekijk vacature »

Fullstack JavaScript Developer Webapplicaties

Bedrijfsomschrijving Voor deze organisatie ben ik op zoek naar een getalenteerde Fullstack JavaScript Developer. Ze is een snelgroeiend software development agency dat zich richt op het ontwikkelen van moderne webapplicaties en complexe systemen voor haar klanten. Ze is gevestigd onder de rook van Utrecht en heeft als doel om tot de top van de Nederlandse agencies te behoren. Deze organisatie maakt softwareoplossingen voor verschillende soorten bedrijven. Innovatie staat hoog in het vaandel en je zult dus met nieuwe technieken aan de slag gaan. Ze hebben klanten in vele branches zitten, zoals retail, finance, gezondheid en onderwijs. De diverse klanten zorgen

Bekijk vacature »

Senior .NET developer

Klaar voor een nieuwe uitdaging? Welke technologieën gaan schuil achter de dagelijkse energievoorziening? Als senior .NET developer bij Kenter maak jij samen met je team het verschil, zowel voor de interne organisatie als voor eindklanten. Samen bouwen jullie aan innovatieve dienstverlening met behulp van de nieuwste technologieën en tools. Het is een functie met veel vrijheid, goede arbeidsvoorwaarden én je draagt jouw steentje bij aan de energietransitie. Klinkt dit als iets voor jou? Lees dan verder of solliciteer direct! Wat ga je doen als senior .NET developer? Als senior .NET developer bij Kenter (onderdeel van Alliander) ben je van onschatbare

Bekijk vacature »

Delphi Programmeur

Functie omschrijving Onze opdrachtgever is gespecialiseerd in kantoor-bedrijfssoftware en zit gevestigd in omgeving Numansdorp. Als programmeur ben jij bij dit bedrijf met het volgende bezig; Je vertaalt technische en functionele ontwerpen naar kwalitatieve software. Je ontwikkelt, ontwerpt en test software. Je maakt daarbij veel gebruik met de volgende tools & technologieën: Delphi 10.3 (Rio), QuickReport 6. Je krijgt in deze rol veel vrijheid en verantwoordelijkheid. Je levert projecten van A - Z op, en werkt daarbij projectmatig en gestructureerd. Bedrijfsprofiel Dit bedrijf richt zich op maatwerk software oplossingen. Deze software oplossingen worden ingezet in de financiële branche. Het betreft een

Bekijk vacature »

Medior/senior front end developer React Sportsoftw

Functie Voor deze functie ben ik op zoek naar een enthousiaste front end developer die communicatief vaardig is. Jij wordt onderdeel van een enthousiast jong team dat werkt aan grote websites. Binnen jouw rol ben jij diegene die de vertaling maakt van design naar functionele code en zorg jij voor goede experience op meerdere platformen. Dit doe je natuurlijk door gebruik te maken van onze stack; Javascript, HTML, CSS en React. Daarnaast wordt er gebruik gemaakt van Webcomponents en verschillende authenticatie tools. Doordat er hier gestreefd wordt naar de beste gebruikerservaringen, wordt het product constant doorontwikkeld. Hierdoor blijven ze voor

Bekijk vacature »

Lasrobotprogrammeur/operator

Heb je interesse in trekkers en beschik je overvlijmscherpse precisie? Solliciteer dan op deze vacature! Als Lasoperator ben je vooral bezig met het maken van nieuwe lasrobotprogramma’s en het optimaliseren van bestaande programma’s, zowel online als offline (incl. het bedienen van de Lasrobots). Daarnaast draag je bij aan een optimaal rendement van de las robots. Verder heb je de volgende werkzaamheden: Het meewerken als operator c.q. Robotlassen niveau 2 (van complexe samenstellingen/halffabricaten), het om- en instellen van de diverse stations van lasmallen (productdragers), het afwerken van laswerk (verwijderen lasspetters en oxiden), het bewaken van de machineplanning (op bewerkingen) incl. de

Bekijk vacature »

Oracle APEX developer

Wat je gaat doen: Als Oracle APEX ontwikkelaar bij DPA werk je samen met collega’s aan de meest interessante opdrachten. Je zult je ervaring met SQL, PL/SQL, JavaScript, HTML en CSS inzetten om wensen van opdrachtgevers te vertalen naar technische oplossingen. Je werk is heel afwisselend, omdat DPA zich niet beperkt tot een specifieke branche. Zo ben je de ene keer bezig binnen de zorgsector, de andere keer is dit bij de overheid. Wat we vragen: Klinkt goed? Voor deze functie breng je het volgende mee: Je hebt een hbo- of universitaire opleiding afgerond Je hebt 2 tot 5 jaar

Bekijk vacature »
Bart C

Bart C

22/11/2012 15:16:28
Quote Anchor link
Hoi,

via php genereer ik een id bij een link. Bij het klikken op de link wordt de pagina herladen terwijl er data weggeschreven wordt.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
<?php
<a href="http://www.test.be/vast.php?weekday=2&starttime=10:15&endtime=10:29&action=available&reference=220:15" id="220:15"><img ... /></a>
?>


Nu dacht ik met dit stukje code ervoor te zorgen dat de pagina de focus terug zou zetten op de laatst aangeklikte link:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
<?php
<script>
$(document).ready(function (){
    $("#220:15").click(function (){
        $('html, body').animate({
            scrollTop: $("#220:15").offset().top
                }, 2000);
        });
    });

</script>

?>


Maar dus niet. Ligt dit aan het feit dat de pagina herladen wordt waardoor de actie 'click' voor het stukje javascript niet in het eerst actieve document zelf plaatsvind maar pas in de nieuwe geopende waar er dan eigenlijk nog geen 'click' gebeurd?

groetjes
Gewijzigd op 22/11/2012 15:16:56 door Bart C
 
PHP hulp

PHP hulp

19/05/2024 12:36:56
 
Kris Peeters

Kris Peeters

22/11/2012 17:15:32
Quote Anchor link
Bart C op 22/11/2012 15:16:28:
... Ligt dit aan het feit dat de pagina herladen wordt waardoor de actie 'click' voor het stukje javascript niet ...


Ja, inderdaad; daar ligt het aan.

Daarvoor was vroeger een oplossing bedacht: live()

ipv.
$("#220:15").click(function (){
doe je:
$("#220:15").live("click", function (){

Dan wordt dat ook uitgevoerd voor elementen die dynamisch zijn geladen.

Tegenwoordig kan dat ook met on() (en off() om het uit te zetten)
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
$("#220:15").on("click", function (){


Uitleg en referentie:
http://api.jquery.com/on/
Video tutorial over dit alles (trouwens, bekijk de rest van de tutorial ook, als je tijd hebt):
https://tutsplus.com/lesson/bind-live-delegate-huh/
 
Bart C

Bart C

22/11/2012 22:00:44
Quote Anchor link
Dag Kris,

dank je voor de interessante link!

Ik krijg het niet werkende. Kan het zijn omdat ik het script via php opbouw?

LINK waarop je klikt en waar er opnieuw naartoe gescrolld moet worden:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
<?php
$link
= '<a href="vast.php?weekday='.$i.'&starttime='.$row['StartTime'].'&endtime='.$row['EndTime'].'&action=available&reference='.$reference.'" id="'.$reference.'"><img src="./img/edit.png" /></a>';
?>


Wanneer je op deze link klikt wordt de pagina opnieuw geladen en worden de gegevens uit de url weggeschreven.
Dan controleer ik ook of de parameter 'reference' aanwezig is:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
<?php
if (isset($_GET['reference']))
{

    $reference = $_GET['reference'];
}

?>


Nadien wordt deze variabele in deze functie gebruikt:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
<?php
echo '$(document).ready(function (){
    $(\'#'
.$reference.'\').live("click", function('.$reference.'){
        $(\'html, body\').animate({
            scrollTop: $(\'#'
.$reference.'\').offset().top
                }, 2000);
        });
    });'
;
?>


Kan dit? Zelfs met live()?
Moet ik $('#referentie') of $('referentie') gebruiken.
Ik verwijs dus niet naar de href maar wel naar de id van de <a>-tag.
Gewijzigd op 22/11/2012 22:01:23 door Bart C
 
Kris Peeters

Kris Peeters

23/11/2012 14:04:13
Quote Anchor link
Dat kan, maar dan wel anders.
De functie waarin de reactie wordt gegeven, geef je een parameter e. Die bevat informatie over het evenement (muiscoördinaten van de klik, de target, ...). Je mag dat niet overschrijven door een parameter die je zelf in de functie kan gebruiken.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
<?php
echo '
$(document).ready(function () {
  $("#'
. $reference . '").live("click", function(e) {  // deze paramater e dus niet vervangen door iets anders
    // het aangesproken element kan je bereiken met this.  this is dus dat element waarop de gebruiker geklikt is
    $("html, body").animate({
      scrollTop: $(this).offset().top
    }, 2000);
  });
});'
;
?>



En verder ... Wanneer je javascript genereert met php, controleer altijd wat dat geeft in de HTML broncode; dan pas zie je of je gedaan hebt wat moet.
Want het is soms wat verwarrend; welke accolade of haakje hoort bij php, welke bij javascript ... php-concateneren met punt; js-concateneren met + ...

----

Iets anders ... je kan dit ook allemaal bereiken met ouderwetse HTML.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
bla ... bla
...

<a name="mijn_anker"></a>
<p> tekst die hoort bij dit item mijn_anker</p>

...
<a href="#mijn_anker">Scroll naar mijn_anker</a>
Gewijzigd op 23/11/2012 14:15:53 door Kris Peeters
 
Bart C

Bart C

23/11/2012 14:44:39
Quote Anchor link
Kris Peeters op 23/11/2012 14:04:13:
Je mag dat niet overschrijven door een parameter die je zelf in de functie kan gebruiken.


Dag Kris,

inderdaad, dat was een foutje van mij. Ik had die laten staan.

Ik zou dit inderdaad kunnen met ouderwetse html maar ik wou eens iets anders proberen. Trouwens, heel interessante website die tutsplus.com! Zal ik zeker benutten.

Ik heb het document even online gezet om te testen
http://www.restaurantterpolder.be/wachtkamer/vast.php

De jquery wordt goed opgebouwd maar het werkt niet.
Is het beter om te werken met #refnr in de url ipv ?reference=refnr?
Gewijzigd op 23/11/2012 14:54:19 door Bart C
 
Kris Peeters

Kris Peeters

23/11/2012 15:12:17
Quote Anchor link
O ja ... dat is dus de bedoeling ...

Dan gaat het niet meer om een click event, maar moet die animate uitgevoerd worden als de pagina wordt geladen

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
<script>
$(document).ready(function (){
  $("html, body").animate({
    scrollTop: $("#717:45").offset().top
    }, 2000
  );
});
</script>
 
Bart C

Bart C

23/11/2012 15:33:24
Quote Anchor link
ok, thx. om het te laten werken heb ik dus nog wat gewijzigd. Ik heb de hashtag toegevoegd als anchor in de url en deze dan zelf in mijn jquery gebruikt:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
<script>
var url = windows.location.pathname;
var hash = url.substring(url.indexOf("#")+1);

$(document).ready(function (){
  $("html, body").animate({
    scrollTop: $("#"+hash"").offset().top
    }, 2000
  );
});
</script>


Dit werkt zoals het zou moeten werken maar nu kom ik erachter dat het systeem niet perfect is :p
Als ik een link aanklik die onderaan de pagina dan reload hij hem, indien mogelijk, boven aan de pagina (wat natuurlijk logisch is met die anchors). Dat zorgt ervoor dat de pagina toch nog af en toe verspringt naar een andere locatie.

Een beter systeem zou zijn om via ajax gewoon dat ene element te herladen. Ik moet de inhoud wel opnieuw inladen (andere link inzetten) maar vooral moet er een andere css-klasse aan toegewezen worden.
Gewijzigd op 23/11/2012 16:14:11 door Bart C
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.