Probleem met het selecteren van een afbeelding

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Advanced Mendix Developer Order Management Systeme

Advanced Mendix Developer Order Management Systemen (NL) Den Haag HBO/WO IT Professional "Als Advanced Mendix Developer impact maken op de groeiende e-commerce markt? Je doet dit bij PostNL door met je DevOps team onze Mendix applicaties verder te ontwikkelen, waarbij je complexe logistieke business processen vertaalt naar applicaties die ons primaire proces ondersteunen". Wat ga je doen? PostNL wordt een postal tech company We nemen de ontwikkeling van onze IT applicaties in eigen hand door onze eigen software-ontwikkel-capability op te zetten. Als Advanced Mendix Developer ben je onderdeel van een multidisciplinair, agile werkend Business-IT-team. Samen met dit team bouw je onze logistieke IT-applicaties verder

Bekijk vacature »

Advanced Mendix Developer Order Management Systeme

Advanced Mendix Developer Order Management Systemen (NL) Den Haag HBO/WO IT Professional "Als Advanced Mendix Developer impact maken op de groeiende e-commerce markt? Je doet dit bij PostNL door met je DevOps team onze Mendix applicaties verder te ontwikkelen, waarbij je complexe logistieke business processen vertaalt naar applicaties die ons primaire proces ondersteunen". Wat ga je doen? PostNL wordt een postal tech company We nemen de ontwikkeling van onze IT applicaties in eigen hand door onze eigen software-ontwikkel-capability op te zetten. Als Advanced Mendix Developer ben je onderdeel van een multidisciplinair, agile werkend Business-IT-team. Samen met dit team bouw je onze logistieke IT-applicaties verder

Bekijk vacature »

Jorn Reed

Jorn Reed

30/12/2018 18:42:40
Quote Anchor link
Ik heb een script geschreven dat afbeeldingen laat vergroten wanneer je er op klikt.
Nu loop ik tegen een paar problemen aan. Omdat de gebruiker zelf afbeeldingen kan uploaden, gebruikt ik $('img') zodat elke afbeelding kan gebruikt worden met die functionaliteit. Ook gebruik ik $(this) zodat alleen de specifiek geklikte afbeelding word uitvergroot. Maar gek genoeg pakt hij alle afbeeldingen van de pagina. Haalt ze van de pagina af en plakt het allemaal in de div die word aangemaakt met de verdwenen afbeeldingen.

Ook doet de close optie het niet die ik op een <a> heb toegepast.

Hier is het Jquery script:
$('.content-block img').click(function () {
const el = $(".photo-size");
el.css("display", "block");
var src = $(this).attr('src');
$('img').appendTo(el).attr('src', src).addClass('highlighted-img');
});

$('.close').click(function (ev) {
ev.preventDefault();
$(".photo-size").css("display", "none");
});
 
PHP hulp

PHP hulp

23/09/2021 14:32:02
 
Ozzie PHP

Ozzie PHP

30/12/2018 22:09:09
Quote Anchor link
>> Maar gek genoeg pakt hij alle afbeeldingen van de pagina.

Nou, zo heel gek is dat niet.

const el = $(".photo-size");

Daarmee pak je alle elementen met de class "photo-size".
 
Thomas van den Heuvel

Thomas van den Heuvel

30/12/2018 22:11:52
Quote Anchor link
Maar dat is precies wat je doet, met $('img') -de 5e regel van het bovenstaande codefragment- selecteer je *alle* afbeeldingen.

Zet bij voorkeur om alle codefragmenten [code][/code] tags, dit verbetert de leesbaarheid en maakt het makkelijker om specifieke regels aan te wijzen.

EDIT, en wat @Ozzie zei dus, jouw selectors zijn te algemeen.
Gewijzigd op 30/12/2018 22:12:29 door Thomas van den Heuvel
 
Jorn Reed

Jorn Reed

02/01/2019 00:29:00
Quote Anchor link
Jorn Reed op 30/12/2018 18:42:40:
Ik heb een script geschreven dat afbeeldingen laat vergroten wanneer je er op klikt.
Nu loop ik tegen een paar problemen aan. Omdat de gebruiker zelf afbeeldingen kan uploaden, gebruikt ik $('img') zodat elke afbeelding kan gebruikt worden met die functionaliteit. Ook gebruik ik $(this) zodat alleen de specifiek geklikte afbeelding word uitvergroot. Maar gek genoeg pakt hij alle afbeeldingen van de pagina. Haalt ze van de pagina af en plakt het allemaal in de div die word aangemaakt met de verdwenen afbeeldingen.

Ook doet de close optie het niet die ik op een <a> heb toegepast.

Hier is het Jquery script:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
$('.content-block img').click(function () {
    const el = $(".photo-size");
    el.css("display", "block");
    var src = $(this).attr('src');
    $('img').appendTo(el).attr('src', src).addClass('highlighted-img');
});
 
$('.close').click(function (ev) {
    ev.preventDefault();
    $(".photo-size").css("display", "none");
});
 
- Ariën -
Beheerder

- Ariën -

02/01/2019 00:33:41
Quote Anchor link
Zelfde bericht uit de startpost :-P?
 



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.