-
AuthorPosts
-
April 11, 2016 at 11:56 am #611144
Hello,
I’m trying to turn off the animation of progress bars on my homepage. I checked some of the previous posts and found these two CSS lines:
.avia-progress-bar div.progress .bar { animation: none !important; }
.avia_transform .avia-progress-bar div.progress.avia_start_animation .bar-outer { -webkit-animation: none !important; -moz-animation: none !important; animation: none !important; }The second one works, however the bars still show one by one in the progress bar box. In other words, animation is not slowly increasing bar, but a simple shift from no bar to bar. What do I need to do to simply show the final progress bar image?
April 11, 2016 at 3:25 pm #611356Hey Iztok!
Please add following code to Quick CSS as well
.avia_transform #top div.progress .bar-outer { width: 100%; }
Best regards,
YigitApril 11, 2016 at 3:32 pm #611362Worked like a charm, thanks. I would love to keep the animation, but it becomes annoying if you need to wait for it to load each time.
By the way, is there anything similar I can add in CSS for Google Maps pins (same page, link provided)?
April 12, 2016 at 5:14 pm #612036Hey!
are you using any plugin for your Google Maps? can you provide us admin access please? so we can take a closer look into it? post login details here as private reply.
Best regards,
AndyApril 14, 2016 at 1:59 pm #613878No plugin for Google Maps is used. I raised the matter of providing you with admin access with colleagues, will get back to you soon. But I honestly thought some CCS can solve the issue.
April 17, 2016 at 6:20 am #615688Hi!
You have to modify the js > shortcodes.js file. Look for this code around line 596:
animation: google.maps.Animation.BOUNCE,
Remove it.
Regards,
IsmaelApril 17, 2016 at 8:10 am #615736Thanks, but this solves only part of my problem. The markers are now not bouncing, but they are still shown one at a time. What I’m after is a map with all the markers shown immediately when you open a page.
April 19, 2016 at 8:09 am #617193Hey!
Replace the block of code starting from line 581 to 617:
var marker = ""; if(!_self.$data.marker[key] || !_self.$data.marker[key].long || !_self.$data.marker[key].long) { $.avia_utilities.log('Latitude or Longitude for single marker missing', 'map-error'); return; } _self.$data.LatLng = new google.maps.LatLng(_self.$data.marker[key].lat, _self.$data.marker[key].long); var markerArgs = { flat: false, position: _self.$data.LatLng, map: _self.map, title: _self.$data.marker[key].address, optimized: false }; //set a custom marker image if available. also set the size and reduce the marker on retina size so its sharp if(_self.$data.marker[key].icon && _self.$data.marker[key].imagesize) { var size = _self.$data.marker[key].imagesize, half = "", full = ""; if(_self.retina && size > 40) size = 40; //retina downsize to at least half the px size half = new google.maps.Point(size / 2, size ) ; //used to position the marker full = new google.maps.Size(size , size ) ; //marker size markerArgs.icon = new google.maps.MarkerImage(_self.$data.marker[key].icon, null, null, half, full); } marker = new google.maps.Marker(markerArgs); marker.setAnimation(null); _self._infoWindow(_self.map, marker, _self.$data.marker[key]);
We remove the setTimeout function.
Cheers!
IsmaelApril 19, 2016 at 8:16 am #617200Worked like a charm. Many thanks for this.
April 19, 2016 at 9:02 am #617224 -
AuthorPosts
- The topic ‘Progress bar animation’ is closed to new replies.