jQuery cloudzoom

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Front-end Developer - React - Data Driven

Bedrijfsomschrijving Onze klant is een snelgroeiende organisatie die een data-driven inspectieapp op de markt hebben gebracht die nu al een aantal jaar door verschillende organisaties wereldwijd gebruikt wordt. Er zijn zo'n 6 mensen werkzaam bij dit bedrijf en ze zijn nu vooral op zoek naar een sterke front-end developer die wil gaan werken aan nieuwbouw applicaties en de uitbouw van de huidige applicaties. De reden dat ze zoeken is omdat er veel werk op komst is en ze hier de juiste capaciteit voor willen hebben. Er heerst hier een hele prettige sfeer waarin respect en eerlijke communicatie belangrijk is. Ook

Bekijk vacature »

Full stack Python developer

Functie Samen met andere collega’s (een product owner, een software manager en een ervaren ontwikkelaar) ga jij onze producten verder ontwikkelen. Jouw verantwoordelijkheden zullen bestaan uit: – Verder wil gaan met de ontwikkeling van onze bestaande producten; nieuwe features! – Meedenkt over de roadmap van onze producten – Als sparringpartner kan optreden op het gebied van development – Zelf ook nieuwe ideeën op tafel durft te leggen en deze van scratch af aan wilt bouwen Hieronder ook een paar voorbeelden van projecten waar we momenteel mee bezig zijn of binnenkort aan willen beginnen: – Real-time interactie creëren in onze web

Bekijk vacature »

Junior .NET developer

Functie Wij hebben drie scrumteams. Het eerste team focust zich op het stukje hardware wat wij in huis doen. Zij maken als team o.a. gebruik van C++. De andere twee scrumteams zijn allebei bezig met data verwerking en maken hierbij in de backend gebruik van C# .NET / .NET Core. Het verschil tussen deze teams is dat één team de data verwerking doet voor de mobiele applicatie. Zij werken hierbij dus ook met Xamarin. Het andere team focust zich op de webapplicaties en maakt hierbij ook gebruik van ASP.NET MVC. Op basis van jouw ambities en kwaliteiten kijken wij samen

Bekijk vacature »

Developer

Functie omschrijving Gaat jouw hart sneller kloppen van software developen in C#.NET? Voor een softwarebedrijf in regio Den Bosch zijn wij op zoek naar een C# programmeur. Lees snel verder! Wat ga je doen? Je gaat werken met C# en ASP.NET MVC Framework om onder meer webapplicaties, webshops en websites te ontwikkelen. Je optimaliseert de bestaande software en helpt mee aan het automatiseren van bedrijfsprocessen. Je gaat samen met je collega's de juiste oplossing op basis van de wensen van de klanten uitwerken tot een mooi product. Bedrijfsprofiel Het ontwikkelen van softwareoplossingen en kantoorautomatiseringen is waar dit bedrijf voor staat.

Bekijk vacature »

Team Lead Java Developer

Functie Wat ga je doen als Java developer? Als Team Lead Java Developer draag een grote verantwoordelijk je stuurt ontwikkelaars aan en staat dagelijks in contact met jou ICT Manager. De team Bestaat uit front-end en backend systemen. Je ben in staat op hoog niveau de technische vak te bepalen en ook te bewaren. Je dag zie er als volgt uit, ontwikkelen van nieuwe en bestaande applicaties, het uitvoeren van processen en analyses en het beschrijven van functioneel ontwerpen. Ook zal samen met jouw Tester applicaties gaan testen door middel van peer reviews en het leveren van support aan gebruikers

Bekijk vacature »

Back-end programmeur

Functieomschrijving Heb jij kort geleden jouw HBO ICT diploma in ontvangst mogen nemen? Of ben je toe aan een nieuwe uitdaging? Voor een uitdagende werkgever in omgeving Waalwijk zijn wij op zoek naar een enthousiaste softwareontwikkelaar met kennis of ervaring met C# en SQL. In een uitdagende rol als C#.NET Developer werk je samen met een enthousiast en informeel team aan het bouwen van maatwerk software voor variërende klanten. Verder ziet jouw takenpakket er als volgt uit: Je draagt bij aan de implementatie van aanpassingen, verbeteringen en aanvullingen in de C# based applicaties; Je houdt je bezig met het ontwikkelen

Bekijk vacature »

Fullstack developer

Zie jij mogelijkheden om onze tooling technisch te verbeteren en uit te bouwen? Over Jobmatix Jobmatix is een innovatieve en internationale speler op het gebied van jobmarketing. Onze jobmarketing automation tool helpt organisaties bij het aantrekken van nieuw talent door vacatures digitaal, geautomatiseerd en op een efficiënte manier te adverteren en onder de aandacht te brengen bij de doelgroep op 25+ jobboards. Volledig performance-based, waarbij organisaties betalen op basis van cost per click of cost per applicant. Maandelijks wordt onze jobmarketing automation tool al gebruikt door vele directe werkgevers, intermediairs en mediabureaus, waaronder Picnic, Rijkswaterstaat, AdverOnline, Schiphol, DPA, Teleperformance en

Bekijk vacature »

Technical Asset Specialist Substations

TenneT is growing fast to realize its strategic ambitions. We play a leading role in driving the energy transition. We are looking for a passionate Technical Asset Specialist for substations (onshore and offshore) at our location in Arnhem who will contribute to this and that might be you? Your contribution to TenneT We are searching for a motivated and engaged colleague as a technical asset specialist (onshore and offshore) for instrument transformers and surge arresters, with preferably a strong background in the area of insulation coordination. As a specialist for insulation coordination you are responsible for overarching topics regarding insultation

Bekijk vacature »

PHP/Symfony developer

Functieomschrijving Vanuit het hoofdkantoor in omgeving Bergen op Zoom ben je als PHP/Symfony Developer niet alleen bezig met software ontwikkeling. Je bent buiten ontwikkeling ook continu bezig met het zoeken naar nieuwe trends en ontwikkelingen die van waarde kunnen zijn voor de efficiëntie van software ontwikkeling. Techstack: PHP, Symfony & mySQL. Jouw takenpakket ziet er als volgt uit: Het ontwerpen en implementeren van webapplicaties met het Symfony-framework; Het testen van ontwikkelde applicaties om te zorgen dat ze goed functioneren en voldoen aan de eisen van de klanten; Het schrijven van een schone en efficiënte code volgens het Symfony framework; Onderhouden

Bekijk vacature »

Junior Software Developer (HBO / WO)

Functie omschrijving Voor een leuke opdrachtgever zijn wij op zoek naar een Junior Software Developer! Sta jij aan het begin van je carrière en heb je net je HBO of WO-diploma in de richting van ICT of Techniek mogen ontvangen? En heb jij grote affiniteit met software development? Dan hebben wij bij Jelling IT Professionals de perfecte opdrachtgever in de omgeving van Hoofddorp. Binnen deze functie vervul je een onsite learning programma waarbij je aan de slag gaat met PHP en Laravel. Hierbij ben je voornamelijk werkzaam op verschillende klantlocaties en is het jouw taak om hun wensen en eisen

Bekijk vacature »

Java Programmeur

Functie Heb jij altijd al samen willen werken met ervaren java ontwikkelaars dan hebben wij hier de ultieme kans voor jou! Voor een opdrachtgever in omgeving van Naaldwijk zijn wij op zoek naar uitbreiding van het vaste ontwikkel team. Je zult je hier voornamelijk bezig gaan houden met; Wijzigingsverzoeken van klanten uitvoeren, hier wordt je diep in betrokken; Samen met consultants sluit je aan bij gesprekken met klanten, voor alle projecten; Je schakelt veel met consultants, wat is de behoefte van de klant? Hoe kan je hierop integreren?; Het framework moet naar de Cloud gebracht worden, je wordt betrokken bij

Bekijk vacature »

Traineeship Front-end developer (WO, 0 tot 3 jaar

Functie Zoals beschreven ga je vanaf start aan de slag bij een passende opdrachtgever, hierbij kijken ze echt naar jouw wensen, kennis/ervaring maar ook de reisafstand. Momenteel hebben ze meerdere klanten waarbij ze groepen hebben opgezet wat maakt dat er diverse uitdagende kansen liggen. Naast het werken bij de opdrachtgever, en het volgen van de masterclasses, zul je regelmatig met de andere trainees in contact zijn. Niet alleen op professioneel vlak maar juist ook bij de borrels en kwartaaluitjes! Kortom; een jaar lang hard aan jezelf werken in combinatie met gezelligheid en plezier. Spreek dit jou aan? Dan komen we

Bekijk vacature »

.NET developer

Functie Als ervaren .NET ontwikkelaar start jij in één van onze vier scrumteams. Met 30 ontwikkelaars werk jij aan de doorontwikkeling van ons core product. Ook werkt jouw team aan maatwerkoplossingen op aanvraag van de klant en op projectbasis. Wij vinden het erg belangrijk dat onze ontwikkelaars met plezier naar werk gaan. Een deel hiervan ligt uiteraard bij jezelf, als jij ontwikkelen niet leuk vindt, ben jij bij ons echt aan het verkeerde adres. Jouw team bestaat namelijk uit een groep gepassioneerde vakidioten die dit werk doen omdat dit eerst een hobby was! Daarnaast wordt er intern rekening gehouden met

Bekijk vacature »

Medior/Senior Front-end Developers gezocht (Utrech

Functie Het team bestaat uit 10+ gespecialiseerde (veel senior) front-end ontwikkelaars en ontwerpers die werken aan projecten voor klanten van verschillende groottes (kan twee jaar bezig zijn met 1 klant). Je helpt klanten met ingewikkelde front-end vraagstukken, hierbij kun je denken aan: UX/UI design, CI/CD, architectuur en integratie met back-end systemen. De werkzaamheden verricht je op locatie bij de klant, dit is vaak in de Randstad. De organisatiestructuur is plat en er heerst een informele sfeer, zo kun je met vragen dus terecht bij de directie. Er wordt veel nadruk gelegd op het bevorderen van persoonlijke ontwikkeling door middel van

Bekijk vacature »

C# .NET Backend Developer HBO Javascript

Samengevat: Deze werkgever is een professionele speler op gebied van IT en E-Commerce. Wil jij werken voor een e-commerce platform? Heb je ervaring met C#, Javascript en Scrum? Vaste baan: C# .NET Developer Backend E-Commerce 3.400 - 4.500 Backend Developer Wij ontwikkelen software voor E-Commerce toepassingen. Ons eigen Content Management systeem biedt een integrale oplossing met diverse ERP software. Onze systemen zijn vaak complex en omvangrijk en draaien bij grote organisaties. Maar ook kleine ondernemingen hebben steeds vaker behoefte aan een vlekkeloos werkende E-Commerce oplossing. Zij bieden een uitdagende werkomgeving met gezellige collega's. Je krijgt veel vrijheid en er is

Bekijk vacature »

Pagina: 1 2 volgende »

Robin S

Robin S

23/01/2013 12:26:49
Quote Anchor link
Beste leden,

Ik ben bezig met een webshop, en ik wil graag bij de product afbeelding een cloud zoom hebben. Nu heb ik alles ingebouwd volgend de handleiding, maar het werkt nog steeds niet:
http://pandamedia.nl/jaewhoo/collection/jae-whoo-limited-t-shirt-design/

Zoals je ziet werkt de mouse-over wel, echter hoort hij dan ook de afbeelding in te zoomen wat nu dus niet gebeurd...

Zo zou het moeten werken:
http://www.starplugins.com/cloudzoom/examples

Iemand enig idee wat ik fout doe?
 
PHP hulp

PHP hulp

26/11/2024 02:41:38
 
- Ariën  -
Beheerder

- Ariën -

23/01/2013 12:32:34
Quote Anchor link
-nvm-
Gewijzigd op 23/01/2013 12:33:46 door - Ariën -
 
Robin S

Robin S

23/01/2013 12:34:18
Quote Anchor link
Zoomt hij ook de afbeelding in bij jou?
Hier werkt het in Chrome en Firefox allebei niet...
 
Tim S

Tim S

23/01/2013 13:09:17
Quote Anchor link
Heb je misschien ook wat relevante code, ik kon het zo snel niet vinden...
 
Robin S

Robin S

23/01/2013 13:19:32
Quote Anchor link
@Tim Slootweg:
Jazeker!
Dit heb ik tussen de head tags geplaatst:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
<link rel="stylesheet" type="text/css" href="http://pandamedia.nl/jaewhoo/wp-content/themes/JaeWhooTheme/cloudzoom.css" />
<script type="text/javascript" src="http://pandamedia.nl/jaewhoo/wp-content/themes/JaeWhooTheme/cloudzoom.js"></script>
<script type="text/javascript">
  CloudZoom.quickStart();
</script>


En de afbeelding roep ik zo op:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<img src="http://pandamedia.nl/jaewhoo/wp-content/uploads/2013/01/collection1.jpg" class="cloudzoom" data-cloudzoom = "zoomImage: 'http://pandamedia.nl/jaewhoo/wp-content/themes/JaeWhooTheme/img/collection_big.jpg' " style="float: left;" />


Het rare is dat de hover wel werkt, maar de zoom niet...
 
Tim S

Tim S

23/01/2013 13:49:48
Quote Anchor link
Als de hover wel werkt zit het probleem denk niet in het javascript gedeelte.

En in het voorbeeld staat ook image en zoomImage, jij heb alleen het laatste. Misschien heeft het er iets mee te maken.
 
Robin S

Robin S

23/01/2013 13:52:25
Quote Anchor link
Dit is het voorbeeld wat ik van de site heb gedownload:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
<img class = "cloudzoom" src = "images/small/image1.jpg"
             data-cloudzoom = "zoomImage: 'images/large/image1.jpg'" />


Zover ik kan zien komt mijn img tag overeen met deze.
 
Tim S

Tim S

23/01/2013 13:56:27
Quote Anchor link
Weet je zeker dat je zoomImage een grote afbeelding is en wat gebeurt er als je zoomImage weg haalt?
Gewijzigd op 23/01/2013 13:56:43 door Tim S
 
Robin S

Robin S

23/01/2013 14:01:59
Quote Anchor link
De grote afbeelding in mijn img tag is:
http://pandamedia.nl/jaewhoo/wp-content/themes/JaeWhooTheme/img/collection_big.jpg

Als ik zoomImage weghaal dan werkt de hover ook niet meer.
 
Tim S

Tim S

23/01/2013 14:15:35
Quote Anchor link
Je heb ook geen id
 
Robin S

Robin S

23/01/2013 14:21:15
Quote Anchor link
Moet ik dit invullen dan? En welke id moet ik kiezen?
Ik zie hier namelijk niets over terug in het voorbeeld van de site.
 
Tim S

Tim S

23/01/2013 14:24:05
Quote Anchor link
van de site:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
<img src="image1.jpg" id = "zoom1" class = "cloudzoom"
     data-cloudzoom = "zoomImage: 'bigimage1.jpg'" />


Het zou kunnen dat de plug-in een id nodig heeft, heet maakt dan volgens mij niet uit welke tenzij je deze kan instellen.
 
Robin S

Robin S

23/01/2013 14:25:24
Quote Anchor link
Ik heb de id toegevoegd, en helaas werkt dit ook niet.. :(
 
Tim S

Tim S

23/01/2013 14:33:16
Quote Anchor link
Je zou kunnen kijken of je dit voorbeeld wel aan de praat krijgt:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
<a  href="#" class="cloudzoom-gallery"
    data-cloudzoom =
         "useZoom: '#zoom1', image: 'image1.jpg', zoomImage: 'bigimage1.jpg'"
    >Image 1</a>
 
Robin S

Robin S

23/01/2013 14:35:58
Quote Anchor link
Als ik nu op "Image 1" klik krijg ik inderdaad de grote afbeelding:
http://pandamedia.nl/jaewhoo/collection/jae-whoo-limited-t-shirt-design/

Hoe kan ik dit werkend krijgen met de zoom functie?
 
Tim S

Tim S

23/01/2013 14:59:32
Quote Anchor link
Wat ik zie is dat je 2 keer een grote image heb, dit moet denk een kleine zijn. Misschien kan je useZoom ook wel in de img tag werkend krijgen.
 
Robin S

Robin S

23/01/2013 15:05:55
Quote Anchor link
Ik heb je voorbeeldje weer even weggehaald, en heb de useZoom in de img tag geplaatst:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<img class="cloudzoom" id="zoom1" src="http://pandamedia.nl/jaewhoo/wp-content/uploads/2013/01/collection1.jpg" data-cloudzoom = "useZoom: '#zoom1', zoomImage: 'http://pandamedia.nl/jaewhoo/wp-content/themes/JaeWhooTheme/img/collection_big.jpg' " style="float: left;" />


Maar zo te zien zijn we weer terug bij af...
 
Tim S

Tim S

23/01/2013 15:48:41
Quote Anchor link
Het voorbeeld van de website zou gewoon moeten werken, sleutelen in iets dat geld kost is zonde. Misschien eens kijken voor een alternatief:
http://www.tripwiremagazine.com/2012/12/jquery-image-zoom.html
 
Robin S

Robin S

23/01/2013 17:24:36
Quote Anchor link
Bedankt voor het advies!
Via jouw link ben ik bij DDpowerZoomer voor jQuery uitgekomen.
Ik heb alles ingebouwd zoals in de manual staat vermeld, en het vergrootglas werkt ook:
http://pandamedia.nl/jaewhoo/collection/jae-whoo-limited-t-shirt-design/

Echter valt deze achter de afbeelding in plaats van ervoor... Hoe kan ik het vergrootglas naar voren halen weer?
 
Tim S

Tim S

23/01/2013 18:59:45
Quote Anchor link
Ik je js bestand van ddpowerzoomer staat onderandere dit:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
init:function($){
        var $magnifier=$('<div style="position:absolute;width:100px;height:100px;display:none;overflow:hidden;border:1px solid black;" />')
            .append('<div style="position:relative;left:0;top:0;" />')


Dit is het enigste stukje waar ik css zie, je zou hier z-index aan kunnen toevoegen.
 
Robin S

Robin S

24/01/2013 18:30:50
Quote Anchor link
Helemaal top Tim!
Je had gelijk met z-index, het werkt prima nu! :D
 

Pagina: 1 2 volgende »



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.