I need to slow the slider down and links not working in IE
Permalink 1 user found helpful
The site I am developing is for persons with disabilities and I have been asked to slow the slider down to make it more readable.
I am using the one that comes with 5.7. Also, the images are not working as links in IE, they are working in Chrome.http://allgodschildrenministries.org......
Any idea how to do this?
Thanks!
Jen
I am using the one that comes with 5.7. Also, the images are not working as links in IE, they are working in Chrome.http://allgodschildrenministries.org......
Any idea how to do this?
Thanks!
Jen
Which slider are you using ? There's quite a few, and knowing which you're using is half the battle.
This is all very disappointing. The adjustments needed should be built into Concrete5.
Very poorly designed.
Very poorly designed.
I am using the one that comes with 5.7. Also, the images are not working as links in IE, they are working in Chrome. http://allgodschildrenministries.org...
Thanks!
Thanks!
I haven't actually found time to check out 5.7 yet, but you should be able to change the speed in view.js. Go to your concrete folder and open blocks then image slider and then you should see view.js as one of the image sliders files.
First line is (function(c,I,B){c.fn.responsiveSlides=function(l){var a=c.extend({auto:!0,speed:500,timeout:4E3,pager:!1,nav:!1,random:!1,pause:!1 and
It should work out that if you up the speed to say 800 it will make your slider slower, a second would be 1000. I just looked quickly so Ill actually check 5.7 out tonight and update this after I know for sure.
Ill also check the i.e issue at that point.
Also check to make sure there's no way to control the speed through the slider options before trying this.
First line is (function(c,I,B){c.fn.responsiveSlides=function(l){var a=c.extend({auto:!0,speed:500,timeout:4E3,pager:!1,nav:!1,random:!1,pause:!1 and
It should work out that if you up the speed to say 800 it will make your slider slower, a second would be 1000. I just looked quickly so Ill actually check 5.7 out tonight and update this after I know for sure.
Ill also check the i.e issue at that point.
Also check to make sure there's no way to control the speed through the slider options before trying this.
It uses the javascript from http://responsiveslides.com/, it states that
speed: 500, // Integer: Speed of the transition, in milliseconds
timeout: 4000, // Integer: Time between slide transitions, in milliseconds
you should change timeout variable.
speed: 500, // Integer: Speed of the transition, in milliseconds
timeout: 4000, // Integer: Time between slide transitions, in milliseconds
you should change timeout variable.
Any Progress on this topic? I recently started a website with the latest concrete 5.7. and have the same issues with the stock image slider. Speed is okay for me but the links are not working properly. Linking to another page only works for the first image. The other ones do not work though each one has a link defined via the block's editing interface.
thx in advance,
Stefan
thx in advance,
Stefan
Hi - I am having the same issue, any news on this?
To slow down the speed of the slideshow you can edit view.js as stated above.
change timeout:4E3 and increase 4 to a new number
changing the speed:500 only increases the ease out time for the image, not the actual time one slide stays live.
Ill come back once i figure out why links are not working.
change timeout:4E3 and increase 4 to a new number
changing the speed:500 only increases the ease out time for the image, not the actual time one slide stays live.
Ill come back once i figure out why links are not working.
I managed to fix the url links on the image slider.
I copied the image_slider block into application/blocks so i can mess with it and still keep the original intact.
1. modified view.css
.ccm-image-slider-container a.mega-link-overlay {
/* position: absolute;*/
z-index: 20;
width: 100%;
height: 100%;
}
i hid the position: absolute part from appearing.
2. modified view.php I wrapped the linkURL to the beginnning and end of the image display.
<?php if($row['linkURL']) { ?>
<a href="<?php echo $row['linkURL'] ?>" class="mega-link-overlay">
<?php } ?>
<?php
$f = File::getByID($row['fID'])
?>
<?php if(is_object($f)) {
$tag = Core::make('html/image', array($f, false))->getTag();
if($row['title']) {
$tag->alt($row['title']);
}else{
$tag->alt("slide");
}
print $tag; ?>
<?php } ?>
<?php if($row['linkURL']) { ?>
</a>
<?php } ?>
line 34 took off... </a>
and added this code after line 47 to close the link
<?php if($row['linkURL']) { ?>
</a>
<?php } ?>
Im sure their might be another way to fix this, but it works for me now that i need it.
Along with modifying view.js timeout: value that takes care of all 3 items brought up here.
Im happy that I can help, as these forums have given me soo much.
I copied the image_slider block into application/blocks so i can mess with it and still keep the original intact.
1. modified view.css
.ccm-image-slider-container a.mega-link-overlay {
/* position: absolute;*/
z-index: 20;
width: 100%;
height: 100%;
}
i hid the position: absolute part from appearing.
2. modified view.php I wrapped the linkURL to the beginnning and end of the image display.
<?php if($row['linkURL']) { ?>
<a href="<?php echo $row['linkURL'] ?>" class="mega-link-overlay">
<?php } ?>
<?php
$f = File::getByID($row['fID'])
?>
<?php if(is_object($f)) {
$tag = Core::make('html/image', array($f, false))->getTag();
if($row['title']) {
$tag->alt($row['title']);
}else{
$tag->alt("slide");
}
print $tag; ?>
<?php } ?>
<?php if($row['linkURL']) { ?>
</a>
<?php } ?>
line 34 took off... </a>
and added this code after line 47 to close the link
<?php if($row['linkURL']) { ?>
</a>
<?php } ?>
Im sure their might be another way to fix this, but it works for me now that i need it.
Along with modifying view.js timeout: value that takes care of all 3 items brought up here.
Im happy that I can help, as these forums have given me soo much.
Thx for your post.
In the original concrete 5.7.3.1 slider, the links were not working in Firefox.
I have modified the script so the entire area of the slider has the link active.
NB : In the original edition, the text is not linked.
Here is the script (blocks/image_slider/view.php), hope it helps someone :
<?php defined('C5_EXECUTE') or die("Access Denied.");
$navigationTypeText = ($navigationType == 0) ? 'arrows' : 'pages';
$c = Page::getCurrentPage();
if ($c->isEditMode()) { ?>
<div class="ccm-edit-mode-disabled-item" style="width: <?php echo $width; ?>; height: <?php echo $height; ?>">
<div style="padding: 40px 0px 40px 0px"><?php echo t('Image Slider disabled in edit mode.')?></div>
</div>
<?php } else { ?>
<script>
$(document).ready(function(){
$(function () {
$("#ccm-image-slider-<?php echo $bID ?>").responsiveSlides({
prevText: "", // String: Text for the "previous" button
nextText: "",
<?php if($navigationType == 0) { ?>
nav:true
<?php } else { ?>
pager: true
<?php } ?>
});
});
});
</script>
<div class="ccm-image-slider-container ccm-block-image-slider-<?php echo $navigationTypeText?>" >
<div class="ccm-image-slider">
<div class="ccm-image-slider-inner">
<?php if(count($rows) > 0) { ?>
<ul class="rslides" id="ccm-image-slider-<?php echo $bID ?>">
<?php foreach($rows as $row) { ?>
<li>
<?php if($row['linkURL']) { ?>
<a href="<?php echo $row['linkURL'] ?>" class="mega-link-overlay">
<?php } ?>
<?php
$f = File::getByID($row['fID'])
?>
<?php if(is_object($f)) {
$tag = Core::make('html/image', array($f, false))->getTag();
if($row['title']) {
$tag->alt($row['title']);
}else{
$tag->alt("slide");
}
print $tag; ?>
<?php if($row['linkURL']) { ?>
</a>
<?php } ?>
<?php } ?>
<a href="<?php echo $row['linkURL'] ?>" class="mega-link-overlay"><div class="ccm-image-slider-text">
<?php if($row['title']) { ?>
<h2 class="ccm-image-slider-title"><?php echo $row['title'] ?></h2>
<?php } ?>
<?php echo $row['description'] ?>
</div></a>
</li>
<?php } ?>
</ul>
<?php } else { ?>
<div class="ccm-image-slider-placeholder">
<p><?php echo t('No Slides Entered.'); ?></p>
</div>
<?php } ?>
</div>
</div>
</div>
<?php } ?>
In the original concrete 5.7.3.1 slider, the links were not working in Firefox.
I have modified the script so the entire area of the slider has the link active.
NB : In the original edition, the text is not linked.
Here is the script (blocks/image_slider/view.php), hope it helps someone :
<?php defined('C5_EXECUTE') or die("Access Denied.");
$navigationTypeText = ($navigationType == 0) ? 'arrows' : 'pages';
$c = Page::getCurrentPage();
if ($c->isEditMode()) { ?>
<div class="ccm-edit-mode-disabled-item" style="width: <?php echo $width; ?>; height: <?php echo $height; ?>">
<div style="padding: 40px 0px 40px 0px"><?php echo t('Image Slider disabled in edit mode.')?></div>
</div>
<?php } else { ?>
<script>
$(document).ready(function(){
$(function () {
$("#ccm-image-slider-<?php echo $bID ?>").responsiveSlides({
prevText: "", // String: Text for the "previous" button
nextText: "",
<?php if($navigationType == 0) { ?>
nav:true
<?php } else { ?>
pager: true
<?php } ?>
});
});
});
</script>
<div class="ccm-image-slider-container ccm-block-image-slider-<?php echo $navigationTypeText?>" >
<div class="ccm-image-slider">
<div class="ccm-image-slider-inner">
<?php if(count($rows) > 0) { ?>
<ul class="rslides" id="ccm-image-slider-<?php echo $bID ?>">
<?php foreach($rows as $row) { ?>
<li>
<?php if($row['linkURL']) { ?>
<a href="<?php echo $row['linkURL'] ?>" class="mega-link-overlay">
<?php } ?>
<?php
$f = File::getByID($row['fID'])
?>
<?php if(is_object($f)) {
$tag = Core::make('html/image', array($f, false))->getTag();
if($row['title']) {
$tag->alt($row['title']);
}else{
$tag->alt("slide");
}
print $tag; ?>
<?php if($row['linkURL']) { ?>
</a>
<?php } ?>
<?php } ?>
<a href="<?php echo $row['linkURL'] ?>" class="mega-link-overlay"><div class="ccm-image-slider-text">
<?php if($row['title']) { ?>
<h2 class="ccm-image-slider-title"><?php echo $row['title'] ?></h2>
<?php } ?>
<?php echo $row['description'] ?>
</div></a>
</li>
<?php } ?>
</ul>
<?php } else { ?>
<div class="ccm-image-slider-placeholder">
<p><?php echo t('No Slides Entered.'); ?></p>
</div>
<?php } ?>
</div>
</div>
</div>
<?php } ?>
I've been having the same problem in 5.7.3.1. No links set on slides worked at all. Inspected in Firefox and discovered that the clickable overlay was being rendered to the right of the actual slideshow.
Adding:
.ccm-image-slider-container a.mega-link-overlay {
left: 0;
top: 0;
}
...to the CSS fixed the problem.
Adding:
.ccm-image-slider-container a.mega-link-overlay {
left: 0;
top: 0;
}
...to the CSS fixed the problem.
Hi Simon,
adding
left: 0;
top: 0;
to .ccm-image-slider-container a.mega-link-overlay
just solved my FF slider link issue
thanks a lot!
una
adding
left: 0;
top: 0;
to .ccm-image-slider-container a.mega-link-overlay
just solved my FF slider link issue
thanks a lot!
una