bxSlider滚动窗的使用 | Django开发

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了bxSlider滚动窗的使用 | Django开发相关的知识,希望对你有一定的参考价值。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/plugins/bxSlider/jquery.bxslider.css">
</head>
<body>

    <ul class="bxslider">
        {% for item in queryset_dict %}
        <li>
            <a href="{{ item.href }}"></a>
            <img style="width:470px;height:215px;"src="/{{ item.img }}" alt="{{ item.name }}">
        </li>
        {% endfor %}
    </ul>
    
    <script src="/static/js/jquery-3.2.1.min.js"></script>
    <script src="/static/plugins/bxSlider/jquery.bxslider.js"></script>
    <script>
        $(document).ready(function(){
          $(.bxslider).bxSlider();
        });
    </script>
</body>
</html>
from django.db import models


# 幻灯片滑动栏
class BxSlider(models.Model):
    status_choice = (
        (0, 下线),
        (1, 上线),
    )
    # choices表示两个tuple,元素比较多的时候就用外键
    status = models.IntegerField(choices=status_choice, default=1)
    # db_index索引,unique=True约束,字段值不许重复
    name = models.CharField(max_length=32, db_index=True, unique=True)
    img = models.ImageField(upload_to=./static/images/focus)
    href = models.CharField(max_length=256)
    create_data = models.DateTimeField(auto_now_add=True)

    class Meta:
        db_table = BxSlider
        verbose_name_plural = 首页轮播

    def __str__(self):
        return self.name
from django.contrib import admin
from app01 import models

admin.site.register(models.BxSlider)
from django.shortcuts import render
from app01 import models


def index(request):
    # models.BxSlider.objects.filter(status=1) 对象
    # 也是queryset类型,只是内部放的是字典
    queryset_dict = models.BxSlider.objects.filter(status=1).values(img, href, name)
    # queryset_list = models.BxSlider.objects.filter(status=1).values_list(‘img‘, ‘href‘, ‘name‘)
    return render(request, index.html, {queryset_dict:queryset_dict})
from django.conf.urls import include, url
from django.contrib import admin
from app01 import views


urlpatterns = [
    url(r^admin/, include(admin.site.urls)),
    url(r^index/, views.index),
]

 

以上是关于bxSlider滚动窗的使用 | Django开发的主要内容,如果未能解决你的问题,请参考以下文章

python3怎么获取弹窗的右边滚动条

jQuery响应式内容滑块插件bxslider

bxslider 使用帮助

使用 jquery 创建唯一 id 以在 bxslider 中使用

移动端弹窗滚动时,底部盒子跟着一起滚动

Wordpress 中的 Lumia-bxslider(lumia-bxslider wordpress 插件)