Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 109,027

HOME > PHP > PHP Forum > พี่ๆ คะจะรบกวนช่วยดูให้ทีค่ะ ว่าจะขยายให้เต็ม 100% ยังไงกับรูปภาพค่ะ



 

พี่ๆ คะจะรบกวนช่วยดูให้ทีค่ะ ว่าจะขยายให้เต็ม 100% ยังไงกับรูปภาพค่ะ

 



Topic : 123410



โพสกระทู้ ( 435 )
บทความ ( 0 )



สถานะออฟไลน์




จาก code ด้านล่างค่ะ ถ้าต้องการปรับให้รูปภาพ abc.jpg ความกว้าง 100% และความสูงเป็น auto ต้องแก้ตรงไหนคะ
รบกวนทีนะคะ ขอบคุณค่ะ

ปล. แก้ตรง 100% ที่บรรทัด 60 , 74, 77 ก็ยังไม่ได้ค่ะ

Code (PHP)
<html>
<head>
<title>Slide Banner</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
    <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="js/jssor.js"></script>
    <script type="text/javascript" src="js/jssor.slider.js"></script>
    <script>
        jQuery(document).ready(function ($) {
            var _SlideshowTransitions = [
            //Fade
            { $Duration: 1200, $Opacity: 2 }
            ];

            var options = {
                $AutoPlay: true, 
                $AutoPlaySteps: 1,
                $AutoPlayInterval: 3000,
                $PauseOnHover: 1,       

                $ArrowKeyNavigation: true,
                $SlideDuration: 500,           
                $MinDragOffsetToSlide: 20, 
                $SlideSpacing: 0,
                $DisplayPieces: 1,
                $ParkingPosition: 0,
                $UISearchMode: 1, 
                $PlayOrientation: 1,
                $DragOrientation: 3,

                $SlideshowOptions: {
                    $Class: $JssorSlideshowRunner$,
                    $Transitions: _SlideshowTransitions,
                    $TransitionsOrder: 1,                      
                    $ShowLink: true                            
                },

                $BulletNavigatorOptions: {                   
                    $Class: $JssorBulletNavigator$,  
                    $ChanceToShow: 2, 
                    $AutoCenter: 1,      
                    $Steps: 1,              
                    $Lanes: 1,              
                    $SpacingX: 10,       
                    $SpacingY: 10,       
                    $Orientation: 1       
                },
                $ArrowNavigatorOptions: {
                    $Class: $JssorArrowNavigator$,
                    $ChanceToShow: 2,                
                    $Steps: 1                               
                }
            };
            var jssor_slider1 = new $JssorSlider$("slider1_container", options);
            function ScaleSlider() {
                var parentWidth = jssor_slider1.$Elmt.parentNode.clientWidth;
                if (parentWidth)
                    jssor_slider1.$ScaleWidth(Math.min(parentWidth,100%));
                else
                    window.setTimeout(ScaleSlider, 30);
            }

            ScaleSlider();

            if (!navigator.userAgent.match(/(iPhone|iPod|iPad|BlackBerry|IEMobile)/)) {
                $(window).bind('resize', ScaleSlider);
            }
        });
    </script>
<div id="slider1_container" style="position: relative;  top: -21px; margin-bottom: -20px;  left: 0px; width: 100%; height: auto; overflow: hidden; "> 
  <div  style="position: absolute;  padding:0px 0px; top: 0px; left: 0px;"> 
    <div style="position: absolute;  background: url(img/loading.gif) no-repeat center center; top: 0px; left: 0px;width: 100%;height:100%;"> 
    </div>
  </div>
  <div u="slides" style="position: absolute; top: 0px; left: 0px; top: 0x; width: 100%; height: auto; overflow: hidden;"> 
<a href=$bannerurl target=_blank><img src=banners/$bannerfile border=0></a>";
</div>
  <style>
            .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
                background: url(img/b05.png) no-repeat;
                overflow: hidden;
                cursor: pointer;
            }

            .jssorb05 div {
                background-position: -7px -7px;
            }

                .jssorb05 div:hover, .jssorb05 .av:hover {
                    background-position: -37px -7px;
                }

            .jssorb05 .av {
                background-position: -67px -7px;
            }

            .jssorb05 .dn, .jssorb05 .dn:hover {
                background-position: -97px -7px;
            }
        </style>
  <div u="navigator" class="jssorb05" style="position: absolute; bottom: 16px; right: 6px;"> 
    <div u="prototype" style="POSITION: absolute; WIDTH: 16px; HEIGHT: 16px;"></div>
  </div>
  <style>
            .jssora12l, .jssora12r, .jssora12ldn, .jssora12rdn {
                position: absolute;
                cursor: pointer;
                display: block;
                background: url(img/a12.png) no-repeat;
                overflow: hidden;
            }

            .jssora12l {
                background-position: -16px -37px;
            }

            .jssora12r {
                background-position: -75px -37px;
            }

            .jssora12l:hover {
                background-position: -136px -37px;
            }

            .jssora12r:hover {
                background-position: -195px -37px;
            }

            .jssora12ldn {
                background-position: -256px -37px;
            }

            .jssora12rdn {
                background-position: -315px -37px;
            }
        </style>
</div>
</body>
</html>




Tag : PHP, HTML/CSS, JavaScript









ประวัติการแก้ไข
2016-06-17 21:06:05
Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2016-06-17 21:04:21 By : because View : 706 Reply : 3
 

 

No. 1



โพสกระทู้ ( 435 )
บทความ ( 0 )



สถานะออฟไลน์


มีใครช่วยตอบทีมั้ยคะ






แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-06-18 15:54:34 By : because
 


 

No. 2



โพสกระทู้ ( 16 )
บทความ ( 0 )



สถานะออฟไลน์
Facebook

ในโค๊ดตัวอย่างไม่เห็นมี abc.jpg เลยครับ

edit :

หมายถึง $bannerfile อันนี้รึเปล่าครับ


ประวัติการแก้ไข
2016-06-18 18:40:54
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-06-18 18:38:49 By : beelzerbub
 

 

No. 3



โพสกระทู้ ( 435 )
บทความ ( 0 )



สถานะออฟไลน์


ใช่ค่ะ ตัวแปร $bannerfile
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-06-20 05:49:07 By : because
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : พี่ๆ คะจะรบกวนช่วยดูให้ทีค่ะ ว่าจะขยายให้เต็ม 100% ยังไงกับรูปภาพค่ะ
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 04
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2024 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่