Forumi


Povratak   PC Ekspert Forum > Računala > Software > Web dizajn, programiranje i ostalo
Ime
Lozinka

Odgovori
 
Uređivanje
Staro 17.07.2015., 11:59   #1
0siris
Banned
 
Datum registracije: May 2015
Lokacija: Stan
Postovi: 122
Pomoć oko JS koda [ neznam js tako dobro ]

ako ima neka dobra duša koja bih mi mogla pomoći oko js skripte riječ je o idućem :

php file :

Citiraj:
<div class="map-switcher">
<button id="map1" type="button" name="button">MAP1</button>
<button id="map2" type="button" name="button">MAP2</button>
</div>

<div class="map1">
<img id="map1img" src="<?php echo wp_get_attachment_image_src( 900, 'full' )[0]; ?>" data-zoom-image="<?php echo wp_get_attachment_image_src( 899, 'full' )[0]; ?>"/>
</div>

<div class="map2">
<img id="map2img" src="http://wallpapers.wallhaven.cc/wallpapers/full/wallhaven-160225.jpg" data-zoom-image="<?php echo wp_get_attachment_image_src( 899, 'full' )[0]; ?>"/>
</div>

dakle imam 2 buttona sa 2 id, map1 i map 2 te 2 imagea sa id map1img i map2img

sass file:

Citiraj:
//MAP SWITCHER

.map-switcher {
padding-bottom: $trim;
button {
display:inline;
width: 50%;
float: left;
background-color: white;
box-shadow: none;
border:1px solid black;
&:hover {
background-color: $blue;
}
}
}


.map2 {
display:none;
}

.map2prikaz {
display:block;
}
e sada bih volio napisati JS kod koji radi iduće :

pri kliku na map1 button prikazuje se mapa1 a druga mapa ima display:none.
pri kliku na map2 button prikazuje se mapa2 a mapa1 dobija display none:

nebih radio preko toggle moda....
koliko znam sass i ostalo toliko neznam js pa ako ima neka dobra duša da mi barem polovično pomogne oko ovog js koda bio bih mu i više nego zahvalan i doista hvala puno!




EDIT:

problem riješen naravno kada postam -_- ali neka ostane možda nekome dobro dođe :

dodane ove klase u sass :
Citiraj:

.map1 {
display:none;
}

.map2 {
display:none;
}

.map2prikaz {
display:block;
}


.map1prikaz {
display:block;
}
js

Citiraj:
jQuery(function() {

jQuery('#map1img, #map2img').elevateZoom({
zoomType: "inner",
easing: true,
responsive: true
});
jQuery('#map2').on('click', function(){
jQuery('.map2').addClass('map2prikaz');
jQuery('.map1').removeClass('map1prikaz');
});

jQuery('#map1').on('click', function(){
jQuery('.map1').addClass('map1prikaz');
jQuery('.map2').removeClass('map2prikaz');
});

var target = jQuery('.zoomContainer')[0]; // Get DOM element from jQuery collection
jQuery('#offcanvas__trigger').click(function () {
if (screenfull.enabled) {
screenfull.request(target);
}
});

});

Zadnje izmijenjeno od: 0siris. 17.07.2015. u 12:28.
0siris je offline   Reply With Quote
Oglas
 
Oglas
Oglasni prostor

Odgovori


Uređivanje

Pravila postanja
Vi ne možete otvarati nove teme
Vi ne možete pisati odgovore
Vi ne možete uploadati priloge
Vi ne možete uređivati svoje poruke

BB code je Uključeno
Smajlići su Uključeno
[IMG] kod je Uključeno
HTML je Isključeno

Idi na