Hãy đăng ký thành viên để có thể dễ dàng trao đổi, giao lưu và chia sẻ về kiến thức đồ họa.
  1. Hãy đăng ký subscribe kênh Youtube mới của Việt Designer tại địa chỉ: Youtube.com/VietDesignerChannel để theo dõi các video về thiết kế đồ họa. Do trước đó kênh cũ bị Youtube quét không rõ lý do, trong thời gian chờ kháng cáo nếu các bạn thấy video trên diễn đàn bị die không xem được thì có thể vào kênh mới để tìm xem video sơ cua nhé.
    Loại bỏ thông báo

Cần giúp chỉnh mã html của hình ảnh

Chủ đề thuộc danh mục 'Blogspot' được đăng bởi ngueyn phu, 17/1/18.

Lượt xem: 5,352

  1. ngueyn phu Mới đăng kí

    Anh chị ơi em có gắng chỉnh mà không được em muốn nó nằm sát lề trái mà không được có anh chị nào giúp em chỉnh cho hình nó sát lề trái không ? Đoạn mã nó như thế này
    Code:
    <style type="text/css">
    
    .container1 {
    width: 660px;padding: 0;margin: 0 auto;
    }
    .folio_block {
    position: absolute;left: 10%; top: 10%;margin: 20px 0 0 10px;}
    .main_view {float: left;position: relative;}
    /*--Window/Masking Styles--*/
    .window {-moz-box-shadow: 0px 0px 5px #303030;
    -webkit-box-shadow: 0px 0px 5px #303030;
    box-shadow: 0px 0px 5px #303030;border:1px solid #000000;height:240px; width: 990px;
    margin-top:15px;overflow: hidden; /*--Hides anything outside of the set width/height--*/
    position: relative;
    }
    .image_reel {
    position: absolute;top: 0; left: 0;
    }
    .image_reel img {float: left;}
    .paging_btrix {
    position: absolute;bottom: 10px; right: 10px;width: 178px; height:47px;z-index: 100; /*--Assures the paging stays on the top layer--*/text-align: center;
    line-height: 40px;
    background: url(http://1.bp.
    	
    blogspot.com/-UQAJVYvatlY/UTbGMUctYcI/AAAAAAAAHIE/PSM-s1tbAd8/s1600/paging_btrix_bg2.png) no-repeat;
    display: none;
    }
    .paging_btrix a {
    padding: 5px;text-decoration: none;color: #fff;
    }
    .paging_btrix a.active {
    font-weight: bold; background: #920000; border: 1px solid #610000;
    -moz-border-radius: 3px;
    -khtml-border-radius: 3px;
    -webkit-border-radius: 3px;
    }
    .paging_btrix a:hover {font-weight: bold;}
    </style>
    <!-- Huong dan thu thuat -->
    <div class="container1">
    <div class="main_view">
    <div class="window">
    <div class="image_reel">
    <a href="http://mmocafe.com"><img src="http://3.bp.
    	
    blogspot.com/-sZ_datgpxTE/UUZtgveicbI/AAAAAAAACdE/IYLX9qd0tvI/s1600/anh-bia-fb-tinh-yeu-10.jpg" alt="tin tuc cong nghe" width='660' /></a>
    <a href="http://mmocafe.com/kiem-tien-online/"><img src="http://3.bp.
    	
    blogspot.com/-_kCy_1GpJxk/UUZtgorGoTI/AAAAAAAACdI/VRrCfJNa4dI/s1600-bia-fb-tinh-yeu-11.jpg" width='660' alt="kiem tien qua mang" width='660' /></a>
    <a href="http://mmocafe.com/topic/iphone-8/"><img src="http://1.bp.
    	
    blogspot.com/-4I9BC6cOxV4/UUZzFHrdsvI/AAAAAAAACe8/UydwOnpn0gM/s1600/anh-bia-tinh-yeu-dep-3.jpg" alt="iphone 8" width='660' /></a>
    <a href="http://cutiseo.
    	
    blogspot.com"><img src="http://4.bp.
    	
    blogspot.com/-FrlydLUmAVg/UUZtgp2wskI/AAAAAAAACdM/Q0-f3SIaanM/s1600/anh-bia-fb-tinh-yeu-1.jpg" alt="huong dan seo" width='660' /></a>
    </div>
    </div>
    <div class="paging_btrix">
    <a href="#" rel="1">1</a>
    <a href="#" rel="2">2</a>
    <a href="#" rel="3">3</a>
    <a href="#" rel="4">4</a>
    </div>
    </div>
    </div>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
    <script type="text/javascript">
    
    $(document).ready(function() {
    
    //Set Default State of each portfolio piece
    $(".paging_btrix").show();
    $(".paging_btrix a:first").addClass("active");
    
    //Get size of images, how many there are, then determin the size of the image reel.
    var imageWidth = $(".window").width();
    var imageSum = $(".image_reel img").size();
    var imageReelWidth = imageWidth * imageSum;
    
    //Adjust the image reel to its new size
    $(".image_reel").css({'width' : imageReelWidth});
    
    //paging_btrix + Slider Function
    rotate = function(){
    var triggerID = $active.attr("rel") - 1; //Get number of times to slide
    var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide
    
    $(".paging_btrix a").removeClass('active'); //Remove all active class
    $active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)
    
    //Slider Animation
    $(".image_reel").animate({
    left: -image_reelPosition
    }, 500 );
    
    };
    
    //Rotation + Timing Event
    rotateSwitch = function(){
    play = setInterval(function(){ //Set timer - this will repeat itself every 3 seconds
    $active = $('.paging_btrix a.active').next();
    if ( $active.length === 0) { //If paging_btrix reaches the end...
    $active = $('.paging_btrix a:first'); //go back to first
    }
    rotate(); //Trigger the paging_btrix and slider function
    }, 5000); //Timer speed in milliseconds (3 seconds)
    };
    
    rotateSwitch(); //Run function on launch
    
    //On Hover
    $(".image_reel a").hover(function() {
    clearInterval(play); //Stop the rotation
    }, function() {
    rotateSwitch(); //Resume rotation
    });
    
    //On Click
    $(".paging_btrix a").click(function() {
    $active = $(this); //Activate the clicked paging_btrix
    //Reset Timer
    clearInterval(play); //Stop the rotation
    rotate(); //Trigger rotation immediately
    rotateSwitch(); // Resume rotation
    return false; //Prevent browser jump to link anchor
    });
    
    });
    </script>

    em muốn hình nó về bên trái hẳn thì sửa làm sao
    [​IMG]

    ...
  2. Hà Duy Phương

    Hà Duy Phương Thành viên cấp 2

    Code:
    .container1 {
    float: left;
    }
    Như thế này nhé. :))

    Mình test rồi nhé. Chắc chắn sẽ nằm bên trái. >:D<
    Chỉnh sửa lần cuối: 17/1/18
  3. ngueyn phu

    ngueyn phu Mới đăng kí

    Bạn cho mình toàn bộ code được không mình sửa nó chạy.Thanks
  4. mahu220

    mahu220 Thành viên cấp 2

    pm fb.com/beohoavinh giúp cho
Từ khóa:

Ủng hộ diễn đàn