이미지 자동 클릭 ? 고수님 부탁 드립니다.
본문
적용하여 오류 없이 잘 되어집니다.
뷰페이지 진입시 아래 첫번째 이미지를 클릭 되어지게 할수 있을까요 ? 고수님 도와주세요!
뷰페이지에서 바로 팝업을 뜨도록 하려구요.
<style>
.object{width: 70px; height: 70px; float:left;margin-right:5px;margin-bottom:5px;border-radius:10px;}
.cover {object-fit: cover}
</style>
<?php
//첨부파일
for ($i=0; $i<count($view['file']); $i++) {
if (preg_match("/\.(gif|jpg|jpeg|png)$/i", $view['file'][$i]['file'])) {?>
<a href="<?php echo $view['file'][$i]['path'].'/'.$view['file'][$i]['file']?>" class="js-smartPhoto" data-caption="<span style=font-size:1.5em;font-weight:bold;><?php echo $view['wr_subject']?></span>" data-id="" data-group=""/ >
<img class="object cover" src="<?php echo $view['file'][$i]['path'].'/'.$view['file'][$i]['file'] ?>"></a>
<?php }} ?>
<?php
//에디터파일
$b_cont_img= get_editor_image($view['content']);
for ($i=0; $i<count($b_cont_img[1]); $i++) {
$b_imgurl_v = explode('"', $b_cont_img[1][$i]);
?>
<a href="<?php echo $b_imgurl_v[1]?>" class="js-smartPhoto" data-caption="<span style=font-size:1.5em;font-weight:bold;><?php echo $view['wr_subject']?></span>" data-id="" data-group=""/>
<img class="object cover" src="<?php echo $b_imgurl_v[1]?>"></a>
<?php } ?>
<!--smartphoto 추가 2/3 끝-->
<!--smartphoto 추가 시작 3/3 시작 (view.skin.php 하단)-->
<script type="text/javascript">
document.addEventListener('DOMContentLoaded',function(){
new SmartPhoto(".js-smartPhoto",{
resizeStyle: 'fit'
});
document.querySelector(".gnb_wrap").style.display = "none";
});
</script>
<!--smartphoto 추가 끝 3/3 끝-->
답변 2
스크립트를 이렇게 수정해보세요.
document.addEventListener('DOMContentLoaded',function(){
var mySmartPhoto = new SmartPhoto(".js-smartPhoto");
mySmartPhoto.gotoSlide(0);
document.querySelector(".gnb_wrap").style.display = "none";
});
</script>
붉은색이 추가 및 수정 된 부분입니다.
어머나... 정말 감사 드립니다.
모든것이 완벽 합니다.!
처음껀 되는데 이건 안되요 ^^;
처음 >>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded',function(){
var mySmartPhoto = new SmartPhoto(".js-smartPhoto");
new SmartPhoto(".js-smartPhoto",{
resizeStyle: 'fit'
});
mySmartPhoto.gotoSlide(0);
document.querySelector(".gnb_wrap").style.display = "none";
});
</script>
이걸로 되긴하는데 팝업이 두번 뜰거에요. new 가 두번이라서 그런데
resizeStyle: 'fit' 이옵션이 들어가야지 슬라이드가 자동으로 나오는데 이걸 해결 할수 있는 방법을 확인해봐야할것 같네요.
팝업 두번 안뜨고 잘 보여져요~
다시 개발자 모드로 보니 같은게 두개 있네요 ^^;
<div data-id="L50LPTN20CCKA"><div class="smartphoto" aria-hidden="false" role="dialog">
<div data-id="L50LPTMMZDPIB"><div class="smartphoto" aria-hidden="false" role="dialog">
잘 될지는 모르겠습니다.
(하단에 추가)
<script>
$('a.js-smartPhoto').first().trigger('click');
</script>
답변 감사 드립니다. 넣어봤는데 안되네요 ^^
